javascript - highcharts zoomable 6 month line graph -


I want a 6 month graph that shows the monthly view by default, but it's up to the zoom-enabled day.

In today's 6-month graph we have:

  xAxis: {title: {text: 'temperature'}, categories: ['October', 'November ',' December '' [January: '' Fur ',' March ',] Series: [[Name:' My series', scene: true, data: [5,10,15,5,7,8, ]}, {Name: another series, scene: true, data: [0,0,0,1468080,}},   

This works very well for the monthly.

To get the daily data I can push data into about 30 * 6 elements. Apart from this, I also tried to use it:

  PointsStart: date.utc (2010, 11, 1), bintierver: 30 * 24 * 3600 * 1000 // one day   

Like this example:

But the problem is not 30 days per month, even the categories do not show categories below the chart.

I am sure that one simple way to do this is to remember me.

Thanks Joel

It looks like though you want to show a data point per month Are trying. If this is the case, then I recommend specifying each data to indicate a time and change the date format.

  // Example 1: Each data point has a time format, whose date format is: var chart = new highchurch. Chart ({chart: {rendereTo: 'container'}, xAxis: {type: 'datetime', dateTimeLabelFormats: {// custom date format for different scales: '% H:% M:% S', min: '% H:% M ', Hour:'% H:% M ', Day:'% E.% B ', Week:'% E.% B ', Month:'% b ', / / ​​Month Only Months Formatted: '% Y'}}, series: [{Data: [{x: Date.UTC (2010, 0, 1), y: 1}, // a data point for each month {x: Date: ATC (2010, 1, 1), Y: 4}, {x: date} UTC (2010, 2, 1), Y: 9}, {x: date.utc (2010, 3, 1), and : 16}, {x: date.utc (2010, 4, 1), y: 25}, {x: date.utc (2010, 5, 1), y: 36}]}]});   

However, it also seems like you want to zoom to the 'day' level. If this is the case, then it is understandable to add all your data points to the series, and use the higher ' zoomType property, perhaps in combination with the date format.

  // Example 2: Each data point represents one day, and we use the 'ZoomType' feature: var chart = new highcharts Chart ({chart: {rendereTo: 'container'}, xAxis: {type: 'datetime', ZoomType: 'x'}, series: [{data: [{x: date.UTC (2010, 0, 1) Y: 1}, // a data point for each day {x: Date.UTC (2010, 0, 2), y: 1.1}, {x: Date.UTC (2010, 0, 3), y: 1.4 }, {X: date.utc (2010, 0, 4), y: 1.8}, {x: date.utc (2010, 0, 5), y: 2.5}, {x: date.utc (2010, 0 , 6), y: 3.8}]}]});    

Comments