Home/ Questions/Q 7525053
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T03:13:55+00:00

I’m trying to display data on a line graph using Google Charts. The data

  • 0

I’m trying to display data on a line graph using Google Charts. The data displays fine, however I would like to set a date range to be displayed.

The data is sent from the database in a JSON literal 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 either displayed by week or month (null for easy reading) for example this week:

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

Data isn’t set for everyday of the week, therefore in this example only the dates above are shown. What I would like to be shown is the start of the week (2012, 02, 06) to the end of the week (2012, 02, 12) similar to the third example here.

I managed to get the whole week showing by checking if the date exists in the database and if not append an extra row will null data, this however meant the line was not continuous and the dates where not in order.

Could anyone offer any advice on how to I could go about doing this?

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Did you try leaving the missing dates be missing dates (i.e. let the database return 2 values instead of 7)?

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

    UPDATE

    for interactive line chart the axis ranges can be set like this (as inspired by this thread):

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

    see http://jsfiddle.net/REgJu/

    • 0