在多个独立轴上同步刻度

Question

我正在制作具有 2 个独立 y 轴的图表。左边是温度数据，右边是湿度数据。我想将右轴的刻度与左轴的刻度和网格线同步。

我已经实现了与 tickPixelInterval 的同步，但仅启用了 startOnTick 和 endOnTick。但不幸的是，这会缩小系列的规模。

https://jsfiddle.net/chartman2000/wLrf9s7x/5/

    yAxis: [
    {
      // startOnTick: false,
        // endOnTick: false,
      gridLineWidth: 1,
      gridLineDashStyle: 'Dash',
      lineWidth: 1,
      lineColor: '#ea0016',
      labels: {
        format: '{value}°C',
      },
      tickPixelInterval: 300 / 5,
      min: 3,
      max: 25
    },
    {
        // startOnTick: false,
      // endOnTick: false,
      gridLineWidth: 0,
      lineWidth: 1,
      lineColor: '#008ecf',
      title: {
        rotation: -90,
      },
      labels: {
        format: '{value}%',
      },
      opposite: true,
      tickPixelInterval: 300 / 5,
      min: 23,
      max: 25.8,
    },
  ],

Chart with false scaling but tick sync

是否有一种解决方案可以同步刻度并获得正确的缩放比例，就像第二小提琴中的图表一样，其中 endOnTick 和 startOnTick 被禁用？

https://jsfiddle.net/chartman2000/wLrf9s7x/

   yAxis: [
    {
      startOnTick: false,
        endOnTick: false,
      gridLineWidth: 1,
      gridLineDashStyle: 'Dash',
      lineWidth: 1,
      lineColor: '#ea0016',
      labels: {
        format: '{value}°C',
      },
      tickPixelInterval: 300 / 5,
      min: 3,
      max: 25
    },
    {
        startOnTick: false,
      endOnTick: false,
      gridLineWidth: 0,
      lineWidth: 1,
      lineColor: '#008ecf',
      title: {
        rotation: -90,
      },
      labels: {
        format: '{value}%',
      },
      opposite: true,
      tickPixelInterval: 300 / 5,
      min: 23,
      max: 25.8,
    },
  ],

Chart with tick sync but false scaling

（紫、棕、橙系列属于左轴|蓝色系列属于右轴）

我这几天一直在寻找解决方案。希望你能帮助我。

Answer 1

您可以手动计算和设置tickPositions：

yAxis: [{
  ...,
  tickPositions: [5, 10, 15, 20, 25],
  min: 3,
  max: 25
}, {
  ...,
  tickPositions: [23.2545, 23.8911, 24.5274, 25.1637, 25.8],
  min: 23,
  max: 25.8,
}]

---

现场演示： https://jsfiddle.net/BlackLabel/n9xhsqfb/1/

API 参考： https://api.highcharts.com/highcharts/yAxis.tickPositions