HighCharts - 设置最小刻度间隔答案

【问题标题】：HighCharts - set minimum Tick IntervalHighCharts - 设置最小刻度间隔
【发布时间】：2020-10-23 04:47:21
【问题描述】：

我有一个列 highchart 我有两个系列，其中的数据如下：

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

[点击余额（图例）。 tickInterval: 1000000]

【问题讨论】：

标签： highcharts angular-highcharts

【解决方案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

【讨论】：

明白了，谢谢！ :)