Google Chart Tools Date Range

Question

I am trying to display data on a line graph using google graphs. The data is displayed well, however I would like to set the date range to be displayed.

Data is sent from the database in literal JSON format:

{ "cols": [ {"label": "Week", "type": "date"}, {"label": "Speed", "type": "number"}, {"type":"string","p":{"role":"tooltip"}}, {"type":"string","p":{"role":"tooltip"}}, {"type":"string","p":{"role":"tooltip"}}, {"type":"string","p":{"role":"tooltip"}}, ], "rows": [ {"c":[{"v": "Date('.$date.')"},{"v": null},{"v": null},{"v": null},{"v": null},{"v": null}]}, {"c":[{"v": "Date('.$date.')"},{"v": null},{"v": null},{"v": null},{"v": null},{"v": null}]} ] } 

Data is displayed by week or month ( null for readability), for example, this week:

 2012, 02, 06 2012, 02, 07 2012, 02, 09 

Data is not set for the daily week, so this example only shows the dates above. What I would like to show is the beginning of the week (2012, 02, 06) until the end of the week (2012, 02, 12), similar to the third example.

I managed to show the whole week by checking if the date exists in the database, and if it does not add an extra row, there will be zero data, this, however, meant that the line was not continuous and the dates when they are not in order.

Can anyone offer any advice on how I can do this?

Thanks!

Answer 1

Did you want to leave the missing dates as missing dates (i.e. return the database 2 values ​​instead of 7)?

The continuous axis should handle missing dates, you just need to set the axis range from the beginning to the end of the week.

UPDATE

for an interactive line diagram, the axis ranges can be set this way (as shown in this thread ):

 hAxis: {... viewWindowMode: 'explicit', viewWindow: {min: new Date(2007,1,1), max: new Date(2010,1,1)} ...} 

see http://jsfiddle.net/REgJu/

Answer 2

"I was able to show the whole week, checking if the date exists in the database, and if there is no additional row added, there will be zero data, this, however, meant that the line was not continuous, and the dates are out of order."

I think that you are on the right track, you just need to do it a little differently. I have a function like the one below to make the data continuous.

 $data = array( 1 => 50, 2 => 75, 4 => 65, 7 => 60, ); $dayAgoStart = 1; $daysAgoEnd = 14; $continuousData = array(); for($daysAgo=$daysAgoStart ; $daysAgo<=$daysAgoEnd ; $daysAgo++){ if(array_key_exists($daysAgo, $data) == true){ $continuousData[$daysAgo] = $data[$daysAgo]; } else{ $continuousData[$daysAgo] = 0; } } 

Continuous information will now be saved:

 $data = array( 1 => 50, 2 => 75, 3 => 0, 4 => 65, 5 => 0, 6 => 0, 7 => 60, 8 => 0, 9 => 0, 10 => 0, 11 => 0, 12 => 0, 13 => 0, 14 => 0, ); 

in that order, and then the data can be used in charts without any spaces.

Answer 3

Perhaps you can use a different type of chart ? Dygraphs looks like it might be useful.

Otherwise, you may have to write your own custom chart type.