I have a string that represent a data like 2014-July-2014. I am formatting this date in javacript so that I can use it as an argument for Google calendar chart.
E.g.
var x = "2014-July-12";
var splitted = x.spilt('-');
// to get "2014" at index [0], "July" at index [1] and "12" at index [2].
I then use a key value array to get the months in number. Then I populate Google calendar data table with..
data.addRow([new Date(ParseInt("splitted[0]"),months.splitted[1], ParseInt("splitted[2]")), dataValues[i].Value]);
I use ParseInt() to convert from string to numbers since new Date(yyy,mm,dd) taks only integers as arguments. I cannot get this calendar working. I searched a lot on the net but cannot find a good example of how to populate Google calendar calendar chart from json file.
Can you guys take a look and guide me how to do this task and explain were i'm wrong. Thanks in advance.
Draw Calendar Chart Function
function drawCalendarChart(jsonObj) {
var dataValues = eval(jsonObj)
var data = new google.visualization.DataTable(dataValues);
data.addColumn({ type: 'date', id: 'Date' });
data.addColumn({ type: 'number', id: 'Reports' });
for (var i = 0; i < dataValues.length; i++) {
var date = new Date(dataValues[i].Date);
var year = date.getFullYear(), month = (date.getMonth() + 1), day = date.getDate();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var Formatted = "" + year + "," + month + "," + day;
// data.addRow([new Date(dataValues[i].Date), dataValues[i].Frequencies]);
data.addRow([new Date(Formatted), dataValues[i].Frequencies]);
}
var options = {
title: "Calendar Chart",
height: 350
};
var chart = new google.visualization.Calendar(document.getElementById('chart'));
chart.draw(data, options);
var table = new google.visualization.Table(document.getElementById('table'));
table.draw(data, { showRowNumber: true });
}
I added the function i'm using to draw the chart. The data is giving a NaN,NaN error. The frequency is getting the right values. So it must be related to date formatting. This is the test string i'm using.
[
{
"Date": "2014-January-15",
"Frequencies": 11
},
{
"Date": "2014-January-8",
"Frequencies": 22
},
{
"Date": "2014-January-10",
"Frequencies": 11
}
]
Keep it simple, this should work:
UPDATE
It worked for me, here you have a working fiddle with the code.
Here is how you can convert your string date values to numbered date.
EDIT
Now you can use this variables in data function as needed.
Here is code
Hope it helps..!!!