javascript - Highcharts：当 xAxis 旋转 90° 时，如何将标签固定到顶部？

Question

这是测试：

$(function() {
var chart;
$(document).ready(function() {
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column'
        },
        title: {
            text: 'Long xAxis legends',
        },
        xAxis: {
            categories: ['a long category name', 'another long category name', 'a very long category name', 'Thats enormous', 'short', 'a long category name', 'another long category name', 'a very long category name', 'Thats enormous', 'short'],
            labels:{
               rotation:90,
               y:100,
            },
        },
        series: [
            {
            name: 'Some values',
            data: [10, 20, 53, 2.51, 1.35, 10, 20, 53, 2.51, 1.35],
            },
            {
            name: 'Other values',
            data: [22.40, 0.15, 40, 10.73, 13, 22, 15, 40.11, 10, 13],
            }
        ],
        legend: {
            layout: 'vertical',
            align: 'top',
            verticalAlign: 'top',
            x: 50,
            y: 65,
            borderWidth: 0,
            margin: 30
        },
    });
});

}); http://jsfiddle.net/Y5Qhm/1/

我想要一个带有顶部对齐的垂直 xAxis 标签的图表。

在我的真实情况下，我会有更多的数据，所以除了轮换我别无他法。

我已经尝试过 xAxis 参数： http ://api.highcharts.com/highcharts#xAxis.labels

我认为对齐可以解决问题，但是当我将它添加到旋转参数时，图表就坏了。

提前致谢。

Answer 1

利用：

align: 'top'

像这样：

labels:{
   rotation:90,
   align: 'top'
   //y:100,
},

jsFiddle：http: //jsfiddle.net/Y5Qhm/2/