Highcharts: Align multiple charts in same container

Question

Following this demo here ( http://www.highcharts.com/docs/chart-and-series-types/combining-chart-types ) I am trying to have a Pie chart and a bar chart on the same page.

The catch is I would like the Pie chart to be large on the left and then the bar chart on the right. I see the code to move the pie chart around, but I cannot figure out how to do the same with the bar chart, as it seems to want to span the entire container width. I understand that I could have two independent charts and place them in their own floating DIVs, but since the combining of charts is possible, I thought this would be a viable option.

Answer 1

You can set chart.marginLeft to half of the chart width. And set pie.center x coordinate to a negative value.

chart: {
   marginLeft: 400
},

series: [{
   center: ['-75%', '50%'],

example: http://jsfiddle.net/L55w9n53/