Google Charts - c.getTimezoneOffset is not a function
7,837 views
Skip to first unread message
Pete Carlile
Mar 1, 2016, 8:15:45 AM3/1/16
to Google Visualization API
Hi, trying to use a json create table and run though Google charts line chart. Getting error message. Any ideas.
File being sent :
{ "cols" : [{"id" : "","label":"Date","pattern":"","type":"date"},{"id":"","label":"GBP","pattern":"","type":"number"},{"id":"","label":"USD","pattern":"","type":"number"},{"id":"","label":"CHF","pattern":"","type":"number"}], "rows" : [{"c" : [{"v":2016-02-29, "f":null},{"v":35657.00, "f":null},{"v":1000.00, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-01, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-02, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-03, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-04, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-05, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]}]}
Sergey Grabkovsky
Mar 1, 2016, 10:08:47 AM3/1/16
to Google Visualization API
Hi Pete,
Your JSON is not syntactically valid. Having "2016-03-02" as a raw value is not proper. Please refer to our Dates and Times documentation page for guidance on how to use dates properly.
--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
--
• | Sergey Grabkovsky | |
• | Software Engineer | |
• | Google, Inc | |
• |
Pete Carlile
Mar 3, 2016, 12:26:36 PM3/3/16
to Google Visualization API
Thanks Sergey.
I change the first column to a string (the dates being just the axis in the graph and it worked fine).
It appears you can not have a date field in col 1 when calling the LineChart function (I tried the correct syntax).
Pete
On Tuesday, 1 March 2016 16:08:47 UTC+1, Sergey wrote:
Hi Pete,Your JSON is not syntactically valid. Having "2016-03-02" as a raw value is not proper. Please refer to our Dates and Times documentation page for guidance on how to use dates properly.
On Tue, Mar 1, 2016 at 8:15 AM Pete Carlile <peteca...@gmail.com> wrote:
Hi, trying to use a json create table and run though Google charts line chart. Getting error message. Any ideas.--File being sent :{ "cols" : [{"id" : "","label":"Date","pattern":"","type":"date"},{"id":"","label":"GBP","pattern":"","type":"number"},{"id":"","label":"USD","pattern":"","type":"number"},{"id":"","label":"CHF","pattern":"","type":"number"}], "rows" : [{"c" : [{"v":2016-02-29, "f":null},{"v":35657.00, "f":null},{"v":1000.00, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-01, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-02, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-03, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-04, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-05, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]}]}
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Sergey Grabkovsky
Mar 3, 2016, 12:31:38 PM3/3/16
to Google Visualization API
Hi Pete,
LineCharts should work fine with dates in any column. I'm not sure whether by "col 1" you mean the first column (indexing starting at 1), or the second column (indexing starting at 0), so here are both examples:
LineChart with date for the first column: http://jsfiddle.net/53w3nph7/
LineChart with date for the second column: http://jsfiddle.net/m0w4fn3v/
If you're still having issues, please modify one of these jsfiddles (or create your own) to exemplify the issue you're experiencing.
On Thu, Mar 3, 2016 at 12:26 PM Pete Carlile <peteca...@gmail.com> wrote:
Thanks Sergey.I change the first column to a string (the dates being just the axis in the graph and it worked fine).It appears you can not have a date field in col 1 when calling the LineChart function (I tried the correct syntax).Pete
On Tuesday, 1 March 2016 16:08:47 UTC+1, Sergey wrote:Hi Pete,Your JSON is not syntactically valid. Having "2016-03-02" as a raw value is not proper. Please refer to our Dates and Times documentation page for guidance on how to use dates properly.On Tue, Mar 1, 2016 at 8:15 AM Pete Carlile <peteca...@gmail.com> wrote:
Hi, trying to use a json create table and run though Google charts line chart. Getting error message. Any ideas.--File being sent :{ "cols" : [{"id" : "","label":"Date","pattern":"","type":"date"},{"id":"","label":"GBP","pattern":"","type":"number"},{"id":"","label":"USD","pattern":"","type":"number"},{"id":"","label":"CHF","pattern":"","type":"number"}], "rows" : [{"c" : [{"v":2016-02-29, "f":null},{"v":35657.00, "f":null},{"v":1000.00, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-01, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-02, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-03, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-04, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-05, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]}]}
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
--
•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/252fe07c-463e-4324-ba81-9b17bc7dc8d9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Boris Bosiljcic
Mar 3, 2016, 4:09:41 PM3/3/16
to Google Visualization API
Hi Sergey,
I have quite a similar problem, I also get the error c.getTimezoneOffset is not a function but my date seems to meet the requirements because I'm using the Unix time stamp as stated in the documentation.
Here is my JSON data and the same data inserted into your fiddle http://jsfiddle.net/bu8g61js/
{
"cols": [
{
"label": "Date",
"type": "datetime"
},
{
"label": "Indoor",
"type": "number"
},
{
"label": "Bedroom",
"type": "number"
},
{
"label": "Outdoor",
"type": "number"
}
],
"rows": [
{
"c": [
{
"v": "new Date(1456952100000)"
},
{
"v": 19.9
},
{
"v": 17.3
},
{
"v": 7.1
}
]
},
{
"c": [
{
"v": "new Date(1456952400000)"
},
{
"v": 19.6
},
{
"v": 17.5
},
{
"v": 7.8
}
]
},
{
"c": [
{
"v": "new Date(1456952700000)"
},
{
"v": 19.1
},
{
"v": 17.1
},
{
"v": 7.2
}
]
}
]
}And here is my JS code the getData.php serves the JSON above
jQuery(function($) {
function load_chart_data(type, period) {
var jsonData = $.ajax({
url: "getData.php",
data: {
'type': type,
'period': period
},
dataType: "json",
async: false
}).responseText;
return jsonData;
}
// Load the Visualization API and the piechart package.
google.charts.load('visualization', '1.1' {
'packages': ['corechart']
});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawTempChart);
google.charts.setOnLoadCallback(drawHumidityChart);
var optionsTemperature = {
'title': 'Temperature',
'width': '100%',
'height': 300,
};
var optionsHumidity = {
'title': 'Humidity',
'width': '100%',
'height': 300,
};
function drawTempChart(period) {
if (typeof(period) === 'undefined') period = 'day';
var data = new google.visualization.DataTable(load_chart_data('temperature', period));
var chartTemperature = new google.visualization.LineChart(document.getElementById('temp_chart'));
chartTemperature.draw(data, optionsTemperature);
}
function drawHumidityChart(period) {
if (typeof(period) === 'undefined') period = 'day';
var data = new google.visualization.DataTable(load_chart_data('humidity', period));
var chartHumidity = new google.visualization.LineChart(document.getElementById('humidity_chart'));
chartHumidity.draw(data, optionsHumidity);
}
$('.menu li').on('click', function(e) {
var period = $(this).data('period');
drawTempChart(period);
drawHumidityChart(period);
})
});On Thursday, March 3, 2016 at 6:31:38 PM UTC+1, Sergey wrote:
Hi Pete,LineCharts should work fine with dates in any column. I'm not sure whether by "col 1" you mean the first column (indexing starting at 1), or the second column (indexing starting at 0), so here are both examples:LineChart with date for the first column: http://jsfiddle.net/53w3nph7/LineChart with date for the second column: http://jsfiddle.net/m0w4fn3v/If you're still having issues, please modify one of these jsfiddles (or create your own) to exemplify the issue you're experiencing.
On Thu, Mar 3, 2016 at 12:26 PM Pete Carlile <peteca...@gmail.com> wrote:
Thanks Sergey.I change the first column to a string (the dates being just the axis in the graph and it worked fine).It appears you can not have a date field in col 1 when calling the LineChart function (I tried the correct syntax).Pete
On Tuesday, 1 March 2016 16:08:47 UTC+1, Sergey wrote:Hi Pete,Your JSON is not syntactically valid. Having "2016-03-02" as a raw value is not proper. Please refer to our Dates and Times documentation page for guidance on how to use dates properly.On Tue, Mar 1, 2016 at 8:15 AM Pete Carlile <peteca...@gmail.com> wrote:
Hi, trying to use a json create table and run though Google charts line chart. Getting error message. Any ideas.--File being sent :{ "cols" : [{"id" : "","label":"Date","pattern":"","type":"date"},{"id":"","label":"GBP","pattern":"","type":"number"},{"id":"","label":"USD","pattern":"","type":"number"},{"id":"","label":"CHF","pattern":"","type":"number"}], "rows" : [{"c" : [{"v":2016-02-29, "f":null},{"v":35657.00, "f":null},{"v":1000.00, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-01, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-02, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-03, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-04, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]},{"c" : [{"v":2016-03-05, "f":null},{"v":35657, "f":null},{"v":1000, "f":null},{"v":6626.45, "f":null}]}]}
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
----
•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/252fe07c-463e-4324-ba81-9b17bc7dc8d9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Sergey Grabkovsky
Mar 3, 2016, 4:15:06 PM3/3/16
to Google Visualization API
Hi Boris,
Your issue is that you have "new" before your Date, which you don't need when using the string version (which is necessary for being able to transfer Dates via JSON). Here is a fixed example that uses the data you posted: http://jsfiddle.net/bu8g61js/1/
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
----
•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/252fe07c-463e-4324-ba81-9b17bc7dc8d9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
--
•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/656d3a32-1921-4816-9096-499d9970befd%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Boris Bosiljcic
Mar 3, 2016, 5:42:28 PM3/3/16
to Google Visualization API
Thank you, you made my day
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/0a14c8ef-f10e-4202-90ad-1b3ec5c6f44f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
----
•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/252fe07c-463e-4324-ba81-9b17bc7dc8d9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
--
•
Sergey Grabkovsky
•
...
Reply all
Reply to author
Forward
0 new messages