图表的宽度正在影响我在 Highcharts 中的第二个 x 轴标签

Question

在我正在处理的应用程序中，我有一个带有两个 x 轴的图表。两者都是category类型（但我认为这无关紧要）并且所有系列都必须附加到第一个轴，所以第二个没有相关数据。

问题在于，根据图表的宽度，是否呈现第二个轴标签。我想总是渲染它们（因为它与第一个完全相关）。我尝试了很多事情：

• linkedTo在第二个轴上应用轴属性。无效，因为轴的表示是错误的。

• 将系列分配给第二个轴。无效，因为数据的表示不是真实的，即使它没有数据，轴也有同样的问题。

• 我一直在玩图表边距，但没有成功。

我在jsfiddle. 在那里你可以看到第二个轴是如何渲染它的水平线的。如果您修改 css 类highcharts-figure，通过缩小元素，例如，设置宽度800px并再次渲染图表，您可以看到两个轴的标签。这就是我的目标。但我希望它适用于任何大小的图表。

此示例在 Highcharts 中运行，v6.1.0因为它是我的应用程序中安装的版本，但最新版本也会出现此问题。

你知道为什么会这样吗？

Answer 1

这一定是个bug？我发现从 CSS 中完全删除宽度可以让它在所有宽度上正确渲染，但不幸的是初始渲染仍然是错误的。

Answer 2

这对我来说似乎也是一个错误。你能在Highcharts Github 问题频道上报告吗？作为临时解决方法，您可以对此附加 xAxis 和“强制”图表进行更新以再次显示该轴。见演示。  chart: {    events: {        load(){        this.xAxis[1].update({            visible: true        })      }    }  },APIhttps://api.highcharts.com/highcharts/chart.events.loadhttps://api.highcharts.com/class-reference/Highcharts.Axis#update

Answer 3

该错误已在highcharts github中发布，并且此问题还有另一种解决方法。基本上，它包括为第二个轴分配一个假序列，就像这样简单：{    showInLegend: false,    xAxis: 1  }在这里你有完整的例子：workaround。（在我原来的帖子中，我说过我尝试了一个类似的解决方案 - 将空系列添加到第二个轴 - 并且它对我不起作用。最有可能是我错了，因为我已经尝试过这种解决方法并且它工作正常。）