Highcharts plotband 标签 zIndex

Lyt*_*thQ 5 highcharts

我试图plotBand在轴下方放置一个刻度,但它的标签在它们上方。

由于标签继承了带区的 zIndex 并且无法指定此属性,是否有一种方法不需要我在绘制图形后更改 zIndex?

请参阅此处的示例,我希望标签出现在 yAxis 刻度前面。

我在这里看到了一个潜在的解决方案,但想知道是否有更好的方法来完成它。

Mat*_*mer 3

许多 Highcharts 似乎不支持开箱即用的 zIndex 属性,因为它使用 SVG。这个问题的答案指出:

“SVG 中的 Z 索引是由元素在文档中出现的顺序定义的。如果您想将特定形状置于顶部,则必须更改元素顺序。”

这就是 .toFront() 函数的作用,因此您可能会在使用它时遇到困难。

我写了一个小片段,在图表第一次渲染时将所有plotBand的标签更新到前面:

Highcharts.Chart.prototype.firstRender = (function (func){
     return function(){
         func.apply(this, arguments);
         $.each(this.axes, function(){
             $.each(this.plotLinesAndBands, function(){
                 this.label.toFront(); 
             });
         });
         this.tooltip.label.toFront();
         this.seriesGroup.label.toFront();
     }
 } (Highcharts.Chart.prototype.firstRender));
Run Code Online (Sandbox Code Playgroud)

这是JSFiddle上的示例。让我知道这是否能满足您的需求。