Highcharts - Multiple charts with same object

Question

With highcharts, I have to display two (or three) charts on the same page and I wonder if it possible to do it without creating two div, with only one object.

I realised a capture to explain : http://el.juky.free.fr/two_charts.jpg

Created from the fiddle : jsfiddle.net/mn92t5tL/2

So I wish to display the line "Line2" and its legend below the first chart "Histo1" and not on it (in fact, the two charts are linked only by the xAxis).

I know it is possible to create 2 div but, because the xAxis are linked, I want to keep only one highchart object, so that the zoom is apply to all graph.

Thank you.

Answer 1

Yes. You can have multiple y axes, and align them vertically.

Example :

• http://jsfiddle.net/jlbriggs/KMA55/5/

code:

yAxis: [{
    height:100
},{
    top:145,
    height:80,
    offset:0
}]

You have to make sure to assign each data series to the relevant axis as well.