CODEWITHSUNDEEP
javascriptchartshighcharts
B 7
B 7

Reputation: 690

Highcharts - Continuous line with centered step (start before the first point)

Using Highcharts, I'm trying to draw a serie with a "step centered". It works, but I really would like that my line start before my first point and goes through my last point.

Here are my options:

series: [{
                type: 'line',
            data: [5, 6, 7, 8, 9 , 10, 11, 12, 13],
            step: 'center',
            name: 'Center'
        }]

A JSFiddle example.

And an illustration of what I want to do on the left:

Start before the first point

and on the right, at the end:

End after the last one

Upvotes: 0

Views: 1033

Answers (1)

Grzegorz Blachliński
Grzegorz Blachliński

Reputation: 5222

You can make similar chart by adding new point before your first point and adding last point after your last point:

  data: [5, 5, 6, 7, 8, 9, 10, 11, 12, 13, 13],

Then you can use xAxis.min and xAxis.max for showing only the range you want on your chart: 

xAxis: {
  categories: ['', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', ''],
  min: 1,
  max: 9
},

Here you can see an example how it can work: http://jsfiddle.net/3ggbqt33/9/

Upvotes: 2

Related Questions