0

我有一个列高图,其中有两个系列,其中的数据如下:

series1 : [10000, 20000, 30000, 40000, 50000]
series2 : [500, 600, 800, 1200, 1400] 

当我有两个轴时,需要设置一个刻度间隔 10000。这样 y 轴的刻度按照 series1 进行。它看起来不错。

现在,我点击legend,只允许显示 series2。

所以只有 series2 在视图中,并且 tickinterval 10000 并不是我们所需要的。

当显示任何一个系列时,即单击图例时,我需要动态调整刻度间隔。我如何实现这一目标?

您可以在以下位置尝试此方案:

https://stackblitz.com/edit/angular-bar-highcharts-kabali

[点击余额(图例)。滴答间隔:1000000]

4

1 回答 1

1

您可以使用legendItemClick事件函数回调并tickInterval动态设置属性:

  events: {
    legendItemClick: function() {
      if (this.visible) {
        this.yAxis.update({
          tickInterval: 100000
        });
      } else {
        this.yAxis.update({
          tickInterval: 1000000
        });
      }
    }
  }

现场演示:http: //jsfiddle.net/BlackLabel/g1weLpkq/

API参考:

https://api.highcharts.com/highcharts/series.column.events.legendItemClick

https://api.highcharts.com/class-reference/Highcharts.Axis#update

于 2020-07-02T17:35:01.957 回答