highcharts,条形图传奇与verticalAlign顶部不起作用

时间:2014-03-22 13:56:05

标签: javascript jquery css highcharts

我使用highcharts创建了一个条形堆积图表,我希望图例位于顶部,我使用属性verticalAlign,其值为top但它不起作用! 这是我的jsfiddle http://jsfiddle.net/rchod/sbtt6/

 $(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },
    legend: {
        align: 'right',
        verticalAlign: 'top',
        x: 0,
        y: 100
    },

    credits: {
        enabled: false
    },
        title: {
            text: ''
        },
        xAxis: {            
            labels: {
            enabled: false
        },
            categories: ['']
        },
        yAxis: {
        labels: {
            enabled: true
        },
            min: 0,
            title: {
                text: ''
            }
        },
        legend: {
            backgroundColor: '#FFFFFF',
            reversed: true
        },
        tooltip: {
            enabled: false
        },
        plotOptions: {
            series: {   
             minPointLength: 3,            
             dataLabels: {
                color: 'white',
                align: 'center',
                enabled: true,
                format: '{y} %'
              },
                stacking: 'percent'
             },
            bar: {
           events: {
                legendItemClick: function () {
                   vote(1,this.userOptions.id);
                   return false; 
                    }
                }
            ,
            showInLegend: true
           }
        },
            series: [
                             {
            name: 'yes',
            data: [{ y : 73.91, id : '1' }],
            id: '1'
        },
                             {
            name: 'no',
            data: [{ y : 26.09, id : '2' }],
            id: '2'
        },
             ]
    });
});

1 个答案:

答案 0 :(得分:1)

您的选项中有legend两次属性。第二个是压倒第一个。把它们放在一起:

legend: {
    backgroundColor: '#FFFFFF',
    reversed: true,
    align: 'right',
    verticalAlign: 'top',
    x: 0,
    y: 100
},

更新了fiddle