I'm trying to populate a Highcharts chart via a javascript call from ASP.Net, I'm using JSON.Net to serialize data for the chart. However, I can't get the JSON created from my datasource to match the formatting that seems to be required by Highcharts. To see the problem you need only examine the X axis (categories), for example...
[{\"category\":\"August 15 and 16, 2014\"},{\"category\":\"March 21st, 2014\"},{\"category\":\"January 17 and 18, 2014\"},{\"category\":\"August 16 and 17, 2013\"},{\"category\":\"March 22nd, 2013\"},{\"category\":\"January 18 and 19, 2013\"},{\"category\":\"August 17 and 18, 2012\"},{\"category\":\"March 16th, 2012\"},{\"category\":\"January 20 and 21, 2012\"},{\"category\":\"August 19 and 20, 2011\"},{\"category\":\"January 21 and 22, 2011\"}]
should be like this...
['August 15 and 16, 2014', 'March 21st, 2014', 'January 17 and 18, 2014', 'August 16 and 17, 2013', 'March 22nd, 2013', 'January 18 and 19, 2013', 'August 17 and 18, 2012', 'March 16th, 2012', 'January 20 and 21, 2012', 'August 19 and 20, 2011', 'January 21 and 22, 2011']
So essentially my serialization is creating a list of objects, where all I need is an array of values. To fix this I either need to generate an array of values, or get the Highcharts constructor to read the objects.
ASP.Net codebehind...
var tblNormal = Reporting.GetHistoricalTicketSalesReport();
var queryX = from row in tblNormal.AsEnumerable()
select new
{
category = row.ShowDateDescription
};
JObject o = JObject.FromObject(new
{
categories = queryX
});
string strXJSON = o.ToString();
// value is: "{\"categories\":[{\"category\":\"August 15 and 16, 2014\"},{\"category\":\"March 21 and 21, 2014\"},{\"category\":\"January 17 and 18, 2014\"},{\"category\":\"August 16 and 17, 2013\"},{\"category\":\"March 22 and 22, 2013\"},{\"category\":\"January 18 and 19, 2013\"},{\"category\":\"August 17 and 18, 2012\"},{\"category\":\"March 16 and 16, 2012\"},{\"category\":\"January 20 and 21, 2012\"},{\"category\":\"August 19 and 20, 2011\"},{\"category\":\"January 21 and 22, 2011\"}]}"
var queryY = from row in tblNormal.AsEnumerable()
select new HighChartsPoint
{
y = row.TicketsSold
};
o = JObject.FromObject(new
{
series = queryY
});
string strYJSON = o.ToString();
//This removes the wrapper around the inner JSON data
strXJSON = F.AllAfter(strXJSON, ":").TrimEnd('}');
//value is: "[{\"category\":\"August 15 and 16, 2014\"},{\"category\":\"March 21 and 21, 2014\"},{\"category\":\"January 17 and 18, 2014\"},{\"category\":\"August 16 and 17, 2013\"},{\"category\":\"March 22 and 22, 2013\"},{\"category\":\"January 18 and 19, 2013\"},{\"category\":\"August 17 and 18, 2012\"},{\"category\":\"March 16 and 16, 2012\"},{\"category\":\"January 20 and 21, 2012\"},{\"category\":\"August 19 and 20, 2011\"},{\"category\":\"January 21 and 22, 2011\"}]"
strYJSON = F.AllAfter(strYJSON, ":").TrimEnd('}');
//Call the function on the client browser
ExecuteJavascript("InitShowChart(" + strXJSON + ", " + strYJSON + ");");