Highcharts图表轴超过设定的最小值和最大值

Question

我想将y轴限制在-43到43的范围内。我还希望我的图表不显示这些值之下或之上的空间/区域/任何内容。这是我的轴选项的样子

yAxis: {
   tickInterval: 1,
   minorTickInterval: null,
   endOnTick: false,
   min: -41,
   max: 43,
   title: {
      text: 'Y Coordinate'
   },
   gridLineColor: 'transparent'
}

但是，在下图中，您可以清楚地看到highcharts正在显示低于我的限制值且低至-45的值的空间。我想要这些硬限制，所以我的背景图像与坐标网格系统完美排列。

我读到将tickInverval设置为1而endOnTick设置为false会产生所需的结果，但似乎并非如此。

有什么想法吗？

Answer 1

刻度位置确定起始轴和终止轴值。您可以使用tickPositions来传递您的头寸或创建一个函数，该函数根据您的最小值和最大值返回滴答位置并将其作为定位器传递。

const random = () => Math.round((Math.random() * 200) - 100)
const options = {
  yAxis: {
    min: -99,
    max: 99,
    // tickPositions: [-99, 99],
    tickPositioner () {
      const axis = this
      return axis.tickPositions.map((pos) => {
        if (pos <= axis.max && pos >= axis.min) return pos // If between range
        else if (pos > axis.max) return axis.max
        else if (pos < axis.min) return axis.min
      })
    }
  },
  series: [{
    data: [...Array(10)].map(random),
    type: 'column'
  }]
}

const chart = Highcharts.chart('container', options)

实例： https://jsfiddle.net/918zb76r/