how to remove space between high chart legend and actual chart

[pankajd]

Hii,

i am working on high chart so i have added legend to the chart.chart has 100% width
now problem is there is vertical space coming between chart and legend
so how to remove space

i have put my code into jsfiddle

https://jsfiddle.net/pankaj_durve/ycf2dzL1/1/


please provide the solution

[mateusz.b]

Hello pankajd,

Thanks for contacting us with your question.

I think in this case reducing chart height would be the best idea. You could try to play a bit with legend alignment options or even try floating legend (https://api.highcharts.com/highcharts/legend.floating), but this most likely won't solve empty space problem. I would suggest something like this:
https://jsfiddle.net/BlackLabel/nv57wm1a/

Let me know what do you think about this solution.
Regards!

[pankajd]

how to give individual height parameter for actual graph and legend
suppose graph having 200px height
legend height equal to 100px

is it possible??

now issue is overlapping legend on chart

Untitled.png (33.54 KiB) Viewed 1323 times

[mateusz.b]

Hello pankajd,

To set height for whole chart it would be chart.height property, only pie size it would be pie.sisze.
When it comes to legend, it is not possible to set fixed legend height. You can use legend.maxHeight to limit it height though.
Demo: https://jsfiddle.net/BlackLabel/b5cdx6k3/
API reference: https://api.highcharts.com/highcharts/series.pie.size,
https://api.highcharts.com/highcharts/legend.maxHeight,
https://api.highcharts.com/highcharts/chart.height

Let me know if you have any further questions!
Regards!