Search code examples
javascriptamcharts4

Amcharts4 - How to disable toggling for first legend item


I faced an issue while working on a stockchart or XYChart series, where I had to display multiple series. Now the requirement was making the very 1st legend item disabled for the toggling functionality.

Well, it was easy to do so when we take the object approach. However, the same becomes a little tricky with the JSON configuration approach. Unfortunately, I had to follow the JSON approach due to existing the migration code.

An example can be found: https://codepen.io/kutec/pen/yLbWyGJ

Related question: https://stackoverflow.com/a/56587291/1841647

Screenshot: enter image description here


Solution

  • I would like to give the below solution that I used to fix my code.

    legend: {
        'itemContainers': {
            'template': {
              'events': {
                'hit': function (ev) {
                  let series = ev.target.baseSprite.series;
                  if (ev.target.dataItem.index === 0) {
                    series.show();
                    series.events.off('hidden');
                  }
                }
              }
            }
        }
    }
    

    Working codepen.

    Hopefully, this would be helpful.

    Thanks.