javascript - Highcharts (HighStock) 不显示附加在其相应 x 轴上的工具提示

Question

我的应用程序中有一个 highStock 图表。此图表有 3 个 y 轴和 2 个 x 轴。我在底部显示一个 x 轴，在顶部显示另一个。并按“高度”属性拆分三个 Y 轴。我将 yAxis[0] 链接到 xAxis[0] 并将另外两个 y 轴链接到第二个 x 轴。

这是y轴：

this.stockChartOptions.yAxis = [
  {
    opposite:false,
    height : '32%',
    title : { text :'pe' },
  },
  {
    opposite: false,
    height : '32%',
    top: '34%',
    title : { text : 'pe forwards' },
    offset :0
  },
  {
    opposite:false,
    height : '32%',
    top : '68%',
    title : { text : 'pe analytical' },
    offset :0
  }
]

这是x轴：

this.stockChartOptions.xAxis = [
  { 
    categories : [],
    type : 'datetime',
    opposite:true,
    labels : {
      rotation : -45,
      formatter: function() {
        return  new Date(this.value).toLocaleDateString('en-US');
      }
    },
  },
  { 
    categories : [],
    type : 'datetime',
    labels : {
      rotation : -45,
      formatter: function() {
        return  new Date(this.value).toLocaleDateString('en-US');
      }
    },
  }
]

问题是：当我为工具提示编写格式化程序方法时，第二个 x 轴的工具提示标签未附加在其对应的 x 轴上。 问题是什么？以及如何解决？ 这是格式化程序方法：

this.stockChartOptions.tooltip = {
  formatter: function () {
    const xAxisBox = new Date(this.x).toLocaleDateString('en-US');
          return ['<b>' + xAxisBox + '</b>'].concat(
            this.points ?
              this.points.map(item => {
                return ` ${item.series.name} : ${item.y}`;
              }): ['']
          );
  },
}

这是问题的图像：

编辑：这是一个 JSFiddle 链接，它准确地显示了问题： https ://jsfiddle.net/avq6yd2n/28/