issue with AJAX all with DateTime type return

[cyoung]

I am looking into using your package for some simple line plotting on a web site. So, I tried a simple AJAX call that returns some data to be plotted.
Everything works with simple integer date points for both X and Y. However, when I change the X axis data type to Date, the data points did not show. I am using C# and their JSON helper.

List <dataPoint> array= new List<dataPoint> () ;
DateTime t = DateTime.Now;
array.Add(new dataPoint(t,10));
t= new DateTime(2013,6,1);
array.Add(new dataPoint(t,30));
Json.Write(array, Response.Output);

this is the JSON string returned by AJAX:
[{“x”:”\/Date(1370439429173)\/”,”y”:10},{“x”:”\/Date(1370070000000)\/”,”y”:30}]

and here is the java script function:

$.ajax({
dataType: “json”,
url: “getChartData.cshtml”,
success: function (data1, status) {
alert(“hello” + data1);
var chart = new CanvasJS.Chart(“chartContainer”, {
data: [{ type: “line”,
dataPoints: data1
}]
});
chart.render();
}
});

As I mentioned, it works when the array returned is a list of <int,int>. The problem occurs when the lsit returned is <DateTime, int>

Thanks for you help. This looks like a nice package.
Charles

[Sunil Urs]

Charles,

Data Points are not in the expected format. You need to remove the quotes and escape characters. Below is the expected Input

{"x": new Date(1370439429173),"y":10},{"x":new Date(1370070000000),"y":30}

here is a link that might be of help.

[cyoung]

Well, according to jsonlint.com

[{“x”:”\/Date(1370439429173)\/”,”y”:10},{“x”:”\/Date(1370070000000)\/”,”y”:30}]
is valid

[{“x”: new Date(1370439429173),”y”:10},{“x”:new Date(1370070000000),”y”:30}]
is NOT valid
Parse error on line 3:
… { “x”: newDate(137043942917
———————^
Expecting ‘STRING’, ‘NUMBER’, ‘NULL’, ‘TRUE’, ‘FALSE’, ‘{‘, ‘[‘

If I use that string above, AJAX throws a parsererror.

I can put quotes around “new Date” to avoid the parser error. But then nothing is plotted.

Both json strings below give a blank chart.
[{“x”:”Date(1370470421781)”,”y”:10},{“x”:”Date(1370070000000)”,”y”:30}]
[{“x”:”new Date(1370470355535)”,”y”:10},{“x”:”new Date(1370070000000)”,”y”:30}]

Would you please look into this further and make sure that CanvasJS is handling the json object from AJAX properly.

Thanks!

[Sunil Urs]

Charles,

I agree that the data you have is in JSON format. But you need to convert it into a JavaScript Objects before passing it to Chart. I’ll consider supporting JSON Date Time format in future version. But for now there is an easy way to do it. You can directly send the timestamps & set xValueType property to “dataTime”.

—
Sunil Urs

[cyoung]

Thanks Sunil,
With a little server side code, I was able to do what I want with xValueType.

Thanks for providing this wonderful plot package. Saves me a LOT of work!!

Charles