在Highcharts中,我想将y轴标题放在顶部,并使其与y轴标签左对齐。

我已经试过了:

$('#container').highcharts({
    ...
    yAxis: {
        ...
        title: {
            align: 'high',
            text: 'Y-axis title',
            rotation: 0,
            y: -10,

            //To left-align title with labels
            textAlign: 'left', //This is undocumented, but appears to work
            margin: 0
        }
    }
})


但是,我得到了过多的左边界,似乎与y轴标题的长度成比例。

javascript - 在Highcharts中将标签的y轴标题左对齐-LMLPHP
JsFiddle

看来保证金计算没有考虑textAlign: 'left'设置。

更新:我应该说我当前的“解决方案”是使用chart.marginLeft设置边距,但这并不理想,因为它是固定的。左边距应足够大以容纳轴标签(无论它们有多大)。

如何将y轴标题与标签左对齐并具有合理的左页边距?

最佳答案

我决定使用marginLeft(是的,您没有看错),但是根据轴标签的长度,可以提供所需的灵活性。

我在这里所做的是将图表选项设置为名为chartOptions的变量。然后,我计算了轴标题的长度(字符数),基于该值设置marginLeft属性,然后使用修改后的图表选项绘制了图表。

chartOptions.chart.marginLeft = chartOptions.yAxis.title.text.length;
var chart = $('#container').highcharts(chartOptions);


这是工作的小提琴:http://jsfiddle.net/brightmatrix/6eeuay58/9/

通过增加一些数据点,我用不同的数字进行了测试。

请告诉我这是否对您有帮助。

关于javascript - 在Highcharts中将标签的y轴标题左对齐,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38393959/

10-13 01:28