hideshowamchartsbullet

Hide/Show of Amcharts bullets doesn't work

I'm using amcharts4 to create large data charts (XY). I want to include two different types of bullets in it. Then these different types shall be switched on/off by the user. I managed to switch off, but not on again.

As my real usecase loads a lot(!) of data, I implemented the bullets in an unusual way to keep performance up: The bullets are disabled and then enabled with propertyfield.disabled.

var smallBullet11 = series1.bullets.push(new am4charts.LabelBullet());
smallBullet11.disabled = true;
smallBullet11.propertyFields.disabled = "hideBullet1";

As a result I can hide, but later on not show the bullets again.

Here is the full example: https://jsfiddle.net/9uwgp85s/

Click on "Hide X-Bullets" first (will work) and then "Show X-Bullets" (won't work).

Has anyone an idea how to switch the bullets on again?

Thanks for any hint!

Solution

  • You'll need to call show/hide on the individual bullets, for example:

    function hidebullets() {
  smallBullet11.clones.each(function(bullet) {
    bullet.hide();
  });
}

function showbullets() {
  smallBullet11.clones.each(function(bullet) {
    bullet.show();
  });
}

    You might also find the minBulletDistance property helpful in improving performance on a line chart with a ton of bullets. It allows you to specify a minimum distance between each point before a bullet is drawn; the larger the distance, the fewer the bullets that will get drawn until you zoom in. You can find more performance tips like this one here.