highcharts-vue中xAxis.tickPositioner在单条数据时浏览器崩溃如何修复

当单条series数据长度为1时，x轴的dataMin与dataMax值完全相等，此时计算得到的步长increment为0，for循环每次执行tick += 0，tick值永远无法超过dataMax，会进入无限死循环，最终导致浏览器资源耗尽崩溃。

在tickPositioner函数中新增单数据点边界判断，当dataMin与dataMax相等时直接返回单个刻度即可，修改后的代码如下：

chartOptions: {
  chart: {
    type: 'areaspline'
  },
  xAxis: {
    tickPositioner: function () {
      let positions = [],        
          tick = Math.floor(this.dataMin),
          increment = Math.ceil((this.dataMax - this.dataMin) / 10)

      if (this.dataMax !== null && this.dataMin !== null) {
          // 新增单数据点边界处理，避免死循环
          if (this.dataMax === this.dataMin) {
            positions.push(tick)
            return positions
          }
          for (tick; tick  <= this.dataMax; tick += increment) {
              positions.push(tick)
          }
      }
      return positions
    }  
  },
  series: [],
  categories: []
}

如果你需要适配分类轴的展示逻辑，也可以在边界判断中直接返回[0]（对应categories数组的第一个下标），效果和上述代码一致。

内容的提问来源于stack exchange，提问作者Dev