css - 在 Highcharts 中为图例添加最大宽度

Question

我创建了一个带有水平中间左侧图例的柱形图。

但使用这种配置(水平+中间+左侧)，图表几乎不可见。

图例应该换行，而不是占据所有可用位置。

解决方案是为图例设置一个最大宽度。但是我该怎么做呢？

这是一个例子:http://jsfiddle.net/zjp8m60w/

    legend: {
        align: 'left',
        verticalAlign: 'middle',
        layout: 'horizontal', 
        floating:false,
    }

谢谢!

Answer 1

如何更改以垂直对齐它们，这样它们就不会覆盖图表。使用 itemWidth 参数，您可以设置标签的宽度。

legend: {
    align: 'left',
    verticalAlign: 'middle',
    floating:false,
    itemWidth: 80,
    floating: false,
    layout: 'vertical'
}

已更新 JSfiddle here

---

水平对齐，自动换行

legend: {
    align: 'left',
    verticalAlign: 'middle',
    floating: false,
    width: 175,
    layout: 'horizontal',
    itemStyle : '{ "word-wrap": "break-word"}'
}

参见 JSFiddle here