How to wrap legend items in highcharts?
You can use:
legend: {
itemStyle: {
width: 90 // or whatever
},
}
And Highcharts will wrap the items for you.
as a note, in 2017 you can use textOverflow
option
legend.itemStyle
CSS styles for each legend item. Only a subset of CSS is supported, notably those options related to text. The default
textOverflow
property makes long texts truncate. Set it tonull
to wrap text instead.
Edit: Actually setting the item width did work, probably a better solution.
Setting the itemWidth doesn't work for me, however you can do something like this:
labelFormatter: function() {
var words = this.name.split(/[\s]+/);
var numWordsPerLine = 4;
var str = [];
for (var word in words) {
if (word > 0 && word % numWordsPerLine == 0)
str.push('<br>');
str.push(words[word]);
}
return str.join(' ');
}
See http://jsfiddle.net/ArmRM/13520/ for an example.