Highcharts align multiple piecharts

2
votes

I made 2 pie charts using Highcharts from different data.

So they have different number of data as well as legends.

But I want to align them properly so chart by chart, legend by legend.

How can I do this?

I tried to set max-height of pie chart legends but that not works. enter image description here

Any help would be appreciated.

2
javascriptd3.jschartshighcharts

2 Answers

0
votes

You will need to use the chart.spacingBottom and chart.spacingTop (API Documentation) to create the same space on both charts like this :

chart: {
  spacingTop:15,
  spacingBottom:18
},

Fiddle

0
votes

With vertical legend layout it will be better to use margin property:

chart: {
    type: 'pie',
    marginBottom: 80
},

Live demo: https://jsfiddle.net/BlackLabel/a62ztm5o/

API: https://api.highcharts.com/highcharts/chart.marginBottom