Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Highcharts set legend height

Given the following fiddle, http://jsfiddle.net/JoelStransky/5QCmG/1

How would I set the legend height so that it doesn't need the navigation? The api doesn't have a legend.height property

like image 315
Joel Stransky Avatar asked Oct 14 '13 21:10

Joel Stransky


Video Answer


2 Answers

I thought maybe the maxHeight property would do it but couldn't get the height to change.

I thought I would mess around with the y property and found a scenario that seems to work pretty good. You can tweak it as you see fit.

 legend:{
            align: 'right',
            verticalAlign:'middle',
            width: 200,
            itemWidth: 100,
            y: 85
        },
like image 111
Trevor Avatar answered Oct 17 '22 04:10

Trevor


Highcharts calculates the height of the legend depending on legend items inside it. if this overflows the chart height then that may cause the issue.

in legend you can restrict the height using the maxHeight, but if the legend height overflows the maxHeight navigation controls appear. so better calculate the required height by yourself and give it to maxHeight to avoid navigation controls,

maxHeight: (no. of legend Items or series count) * line height of each item/2

hope this may work.

like image 29
Strikers Avatar answered Oct 17 '22 05:10

Strikers