CODEWITHSUNDEEP
highcharts
RaJeSh
RaJeSh

Reputation: 313

In a Highchart, how to display the legend text in next row if the text is too long?

I have highchart like this.
How can I display the legend (Firefox,IE,chrome...) text in next row if the text is too long?
Image describing my problem is Here

P.S. I am not familiar with jQuery. Expecting a solution

Upvotes: 1

Views: 3788

Answers (1)

Gopinagh.R
Gopinagh.R

Reputation: 4916

You will need to make use of a labelFormatter

                labelFormatter: function() 
                {
                      var legendName = this.name;
                      var match = legendName.match(/.{1,10}/g);
                      return match.toString().replace(/\,/g,"<br/>");
                }

I have made an edit to the fiddle and you can find it Here. It pushes the legend item text to next line after every 10 characters. Guess this is what you needed.
Hope this helps.

Upvotes: 4

Related Questions