如何更改 Highchart 中图例的布局和对齐方式？

Posted 2023-02-16

【中文标题】如何更改 Highchart 中图例的布局和对齐方式？

【英文标题】：How to change the layout and the alignment of the legend in the Highchart?

【发布时间】：2014-04-16 20:07:20

【问题描述】：

我正在尝试更改 Highchart 中图例的布局和对齐方式。

在 javascript 中，代码最初是：

showInLegend: true

然后我修改为：

legend: 

    layout: 'vertical',
    enabled: true,
    x: 0,
    y: 20,
    align: 'right',
    verticalAlign: 'middle',
    margin: 30,
    ...
  

...然而，传说仍然没有移动。

【问题讨论】：

你能设置一个代表 jsFiddle 来重现这个问题吗？

那么在图表初始化之后你想更新图例吗？

谢谢。我不太清楚你的意思，但我想改变传说的对齐方式。也就是说，我希望图例是垂直的，而不是目前的水平。

【参考方案1】：

确保您的图表选项中没有重复的属性legend。

在一般情况下它有效，请参阅：http://jsfiddle.net/3bQne/1010/

var chart = new Highcharts.Chart(
    chart: 
        renderTo: 'container1'
    ,
    legend: 
        layout: 'vertical',
        enabled: true,
        x: 0,
        y: 20,
        align: 'right',
        verticalAlign: 'middle',
        margin: 30
    ,

    series: [
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0]
    ]
);