0

我以可读的方式将我的 y 轴标题放在了轴的顶部（所以，转了 90°；就像这里一样）。但问题是 y 轴标题越长，图表被推开的越多。我可以用“偏移量”来纠正。

title: 
{
  text: "Very important data here",
  align: 'high',
  rotation: 0,
}

现在，我有很多图表。并且它们都具有三个翻译（de、en、fr）作为同一图表中的文本元素。所以，代码总是一样的。不可能为每个平移手动调整偏移量。

因此，我试图找到一个计算短标题和长标题的正确偏移量的公式（如这里）。现在，我正在使用“ offset: txt.length * -5.5 ”；但标题越长，效果就越差。尝试使用 SQRT，但没有真正成功。

offset: txt.length * -5.5,

有没有人有一个巧妙的方法来做到这一点？

4

2 回答 2

3

您可以让 Highcharts 绘制偏移量错误的默认图表，然后计算标题的宽度并简单地更新偏移量：

chart: {
        events: {
            load: function () {
                var chart = this,
                    yAxis = chart.yAxis[0],
                    firstLabel = yAxis.ticks[yAxis.tickPositions[0]].labelBBox.width,
                    lastLabel = yAxis.ticks[yAxis.tickPositions[yAxis.tickAmount - 1]].labelBBox.width,
                    bb = yAxis.axisTitle.getBBox();
                yAxis.update({
                    title: {
                        offset: -bb.width + (firstLabel > lastLabel ? firstLabel : lastLabel) //make sure that will be enough space for yAxis labels
                    }
                });
            }
        }
    }

和 jsFiddle：http: //jsfiddle.net/kL5md/6/

Highcharts 4.x 演示：http: //jsfiddle.net/kL5md/21/

于 2013-05-22T11:19:37.453 回答
1

当系列动态添加到图表时，上面的代码将不起作用。在这种情况下，只需将上述代码放入系列对象下的 afterAnimate 事件中即可。

plotOptions:{
                series:{
                    events:{
                        afterAnimate: function(){
                            console.log('test', this.chart.yAxis[0]);
                            var chart = this.chart,
                            yAxis = chart.yAxis[0],
                            tp = yAxis.tickPositions,
                            firstLabel = yAxis.ticks[tp[0]].label.getBBox().width,
                            lastLabel = yAxis.ticks[tp[tp.length - 1]].label.getBBox().width,
                            bb = yAxis.axisTitle.getBBox();

                            yAxis.update({
                                title: {
                                    offset: -bb.width + (firstLabel > lastLabel ? firstLabel : lastLabel) + 15
                                }
                            });
                        }
                    }
                },
            }

于 2017-09-11T14:05:52.377 回答