Menu
In my app users can add/remove as many series they want to the HighStock component using a piece of UI I wrote. However, when a user adds multiple time-series and the legend is under the chart, it shrinks the chart's height (in favor of the legend). This way the overall height remains constant.
However, I'm interested in having the plotting area keeping the same height and still have the legend be under it, changing the overall height if needed.
code
Here's a fiddle to demo the issue.
Ideas?
789
use chart. setSize(width, height, doAnimation = true); in your actual resize function to set the height and width dynamically.
Most Highcharts elements displayed on a chart can be positioned using x and y values relative to the top left corner and using the align and verticalAlign options. The align option can have the values 'left' , 'right' and 'center' . The verticalAlign option can have the values 'top' , 'bottom' and 'middle' .
The legend displays the series in a chart with a predefined symbol and the name of the series. Series can be disabled and enabled from the legend.
credits: { enabled: false }, that will remove the "Highcharts.com" text from the bottom of the chart.
set maxHeight property. this will fix the maximum height of legend and gives navigation to legend.
maxHeight: 100,
here is the fiddle http://jsfiddle.net/9vZ8F/2/
instead if you remove
layout:'vertical'
legend will not occupy much space here is a fiddle for it http://jsfiddle.net/9vZ8F/1/
Hope this is useful to you.
74
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
