Using Highcharts javascript in Web Application

Question

I am experimenting with Highcharts in my .Net application.

I have some data that I need to include, but can't seem to figure out where to add it.

     /*X axis coordinates*/
     List<int> lstXaxis = new List<int>();
     lstXaxis.Add(2007);
     lstXaxis.Add(2008);
     lstXaxis.Add(2009);
     lstXaxis.Add(2010);

I need to setup public properties so that my aspx page can access it.

Do I include these two commands in the C# code behind the aspx page?

      public string Series1 { get; set; }
      public string Xaxis { get; set; }

And use the accessors to convert the x-axis data?

      JavaScriptSerializer oSerializer = new JavaScriptSerializer();
      Xaxis= oSerializer.Serialize(lstXaxis);

I am referencing the following site as a startup point: http://deebujacob.blogspot.com/2011/05/aspnet-and-highcharts.html

Answer 1

The xAxis list goes in the code-behind. Probably on the page load.

The two code snippets you provided:

  public string Series1 { get; set; }
  public string Xaxis { get; set; }

and

  JavaScriptSerializer oSerializer = new JavaScriptSerializer();
  Xaxis= oSerializer.Serialize(lstXaxis);

Go in the code-behind of whatever page is going to have the chart displayed on it.

Answer 2

I found another simpler for generating charts in .NET. Imagine generating charts like this;

DataTable tbl; //your datatable with chart info.. 

//the series you would like to draw, first value corresponds to the name of the column, 2nd value to the title you would to use for that chart
string[] serieslist = { "allorders,All orders", "shippedorders, Shipped orders", "rejectedorders,Rejected orders" };

//getting the chart string
string chartString = chart.DrawChart(tbl, serieslist, "yearly-report", "date", "Yearly sales report", "my subtitle", "column", false);

Drawing a chart in 3 lines!

Look at this blog enter for more info. http://www.phronesisweb.com/blog/using-highcharts-with-net-without-any-extra-control-generating-a-highchart-chart-in-just-one-method/