使用highcharts.js标签进行绘制时会偏离中心而不是居中

Plotting using highcharts.js labels are being rendered off-center in stead of being centered

本文关键字：标签 js highcharts 绘制 使用      更新时间：2023-09-26

我正在使用highcharts(highcharts.js(创建一个使用"bands"功能的绘图。波段配置如下：

"plotBands": [{
                "color": "#E5F6F6",
                "from": -0.5,
                "to": 4.5,
                "label": {
                    "text": 'January',
                    "align": "center",
                    "verticalAlign": "top"
                }
            }, {
                "color": "#FFFFFF",
                "from": 3.5,
                "to": 8.5,
                "label": {
                    "text": "February",
                    "align": "center",
                    "verticalAlign": "top"
                }
            }]

此配置在标签上使用align:centre，因此它们应该水平居中。不幸的是，它们正在偏离中心进行渲染。

你可以在这里找到一把小提琴来演示这个问题：http://jsfiddle.net/MpvSA/。

"一月"标签应该水平居中，但它显示的比例是65%，而不是50%。这个问题在我尝试过的所有浏览器中都能可靠地重现。

知道为什么标签偏离中心以及如何纠正吗？

这是因为有两个绘图带，白色(右(首先重叠，因为太宽。(比例尺为7，但绘图带为8.5(

所以您可以将zIndex设置为第一个(蓝色(，问题就会消失。http://api.highcharts.com/highcharts#xAxis.plotBands.zIndex

相关文章：