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/