CODEWITHSUNDEEP
javascripthighcharts
MedBed JS
MedBed JS

Reputation: 3

How to create a range between series?

Does anyone have an idea how to optimize the series display by adding range between series when there is no value like the picture below.

enter image description here

For exemple between 3500MW and 6500MW there is no value so how to do to in order to compact the series display like in the picture

thank alot for your help : )

Upvotes: 0

Views: 50

Answers (2)

MedBed JS
MedBed JS

Reputation: 3

I Have tried using yAxis with type: 'logarithmic'? significantly reduce gap between far values. Demo: [https://jsfiddle.net/BlackLabel/vj83L76q/]

Highcharts.chart('container', { chart: { type: 'line' },enter code here yAxis: { type: 'logarithmic' }, series: [{ data: [100, 1000, 2000, 3000, 7000, 20000] }]

Upvotes: 0

Barbara Laird
Barbara Laird

Reputation: 12717

You're looking for yAxis.breaks

yAxis: {
    lineColor: 'black',
    lineWidth: 2,
    title: false,
    tickInterval: 100,
    breaks: [{
        from: 500,
        to: 3000
    }],
    events: {
        pointBreak: pointBreakColumn
    }
},

breaks defines where you would like the breaks to occur in the axis. The pointBreak event allows you to add special styling at the break points (for example, your zigzag line in the image).

Upvotes: 2

Related Questions