CODEWITHSUNDEEP
javascriptjqueryhighcharts
Raein Hashemi
Raein Hashemi

Reputation: 3384

Highcharts plotLines with multiple xAxis and yAxis

I have a chart with multiple xAxis and yAxis. I want to have multiple plotLines on the xAxis, but each plotLine doesn't stay on it's course. Here's the fiddle. Click on All to see what I mean.

The plotLine on the first axis goes to the second axis as well. How could I stop it?

Upvotes: 2

Views: 909

Answers (1)

sheilak
sheilak

Reputation: 5873

There is a solution suggested in the HighCharts issue tracker which involves defining the related xAxis on each yAxis. So a plotline defined on a particular xAxis will use the top and height of the related yAxis to draw the plotline only in the correct area.

yAxis: [{
    title: {
        text: 'OHLC'
    },
    height: 200,
    lineWidth: 2,
    xAxis: 0,
}, {
    title: {
        text: 'Volume'
    },
    top: 300,
    height: 100,
    offset: 0,
    lineWidth: 2,
    xAxis: 1,
}, {
    title: {
        text: 'Other data panel'
    },
    top: 300,
    height: 100,
    offset: 0,
    lineWidth: 2,
    opposite: true,
    xAxis: 1,
}]

Updated Fiddle with each plotline only on its corresponding pane.

Note that the ability to define related axes appears to be undocumented in the API.

Upvotes: 3

Related Questions