One of my challenges involves using a 'Timelines' chart from Google Charts, which requires a JavaScript Date type when populating data.
Here is my initial code snippet:
var container = document.getElementById('divChart1');
var chart = new google.visualization.Timeline(container);
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({ type: 'string', id: 'Name' });
dataTable.addColumn({ type: 'string', id: 'Category' });
dataTable.addColumn({ type: 'date', id: 'Start' });
dataTable.addColumn({ type: 'date', id: 'End' });
My current challenge lies in populating the chart through AJAX, particularly with the Date types causing issues.
The data rows should be populated as follows:
dataTable.addRows([
['Aaa', 'A', new Date(2014, 1, 1), new Date(2016, 12, 31)],
['Bbb', 'B', new Date(2014, 1, 1), new Date(2016, 5, 31)]]);
Is there a way to return a serialized collection from my AJAX service and parse it directly, or do I need to iterate through the collection and create a new JavaScript Date each time?
Attempting
dataTable.addRows(JSON.parse(result.chartData));Error: Type mismatch. Value 2015-08-26T11:59:23.889004+02:00 does not match type date in column index 2For reference, here's how the AJAX service appears:
List<List<object>> chartData = new List<List<object>>();
chartData.Add(new List<object>() {
"Aaa",
"A",
DateTime.Now,
DateTime.Now.AddMonths(3)
});
return JsonConvert.SerializeObject(chartData);
edit: After some tweaking, this is what worked for me:
chartData.Add(new List<object>() {
"Aaa",
"A",
DateTime.Now.Year + "#" + DateTime.Now.Month + "#" + DateTime.Now.Day,
DateTime.Now.AddMonths(3).Year + "#" + DateTime.Now.AddMonths(3).Month + "#" + DateTime.Now.AddMonths(3).Day
});
var result = $.parseJSON(result.chartData);
$.each(result, function (k, v) {
var s = v[2].split('#');
var e = v[3].split('#');
dataTable.addRow([v[0], v[1], new Date(s[0], s[1], s[2]), new Date(e[0], e[1], e[2])]);
});
This workaround is not intended as the official answer since it doesn't fully address the original question.