I have an highcharts linechart with data. I want to display the data with datetime on the x-axis. This works fine, my only problem is that the x-axis always seems to end at the end of my data.

I want to display the whole year in months, even if there are only 3 months available.

Is there a way to "Force" the x-axis to do this?

I have an highcharts linechart with data. I want to display the data with datetime on the x-axis. This works fine, my only problem is that the x-axis always seems to end at the end of my data.

I want to display the whole year in months, even if there are only 3 months available.

Is there a way to "Force" the x-axis to do this?

• javascript
• angularjs
• highcharts

Share Improve this question Follow asked May 15, 2014 at 7:24 Jelle SmeetsJelle Smeets 15844 silver badges1111 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

You don't have to pass any null values - all you have to do is set an axis min and max.

That way, no matter what data you send, the full time span will be displayed.

• http://api.highcharts./highcharts#xAxis.min
• http://api.highcharts./highcharts#xAxis.max

for example:

• http://jsfiddle/jlbriggs/LeXmz/

Highcharts will only show the last data point that is specified. If you want to force it to show the the whole year ,you will have to pass it all the data points for the those times you want displayed, but for the value pass null.

series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6,
               null, null, null, null, null, null, null, null, null, 
               null, null, null, null, null, null, null, null],
        pointStart: Date.UTC(2010, 0, 1),
        pointInterval: 1 * 3600 * 1000 * 24 // one hour
    }]

Fiddle example