在 Web 应用程序中使用 Highcharts javascript答案

【问题标题】：Using Highcharts javascript in Web Application在 Web 应用程序中使用 Highcharts javascript
【发布时间】：2023-04-01 23:46:01
【问题描述】：

我正在我的 .Net 应用程序中试验 Highcharts。

我有一些需要包含的数据，但似乎不知道在哪里添加。

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

我需要设置公共属性，以便我的 aspx 页面可以访问它。

我是否在 aspx 页面后面的 C# 代码中包含这两个命令？

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

并使用访问器来转换 x 轴数据？

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

我将以下网站作为起点： http://deebujacob.blogspot.com/2011/05/aspnet-and-highcharts.html

【问题讨论】：

你试过这种方式吗 xAxis: , series: [] 你给我们的例子很清楚
还有一些包装器。两者都已过时（不支持新的 highcharts 2.3.2 或任何级别的 highstock）。它们是 Dotnet.Highcharts 和 Highcharts.Net。
我是新手，所以我想我不明白在哪里添加代码 sn-ps。 x轴坐标在哪里？我要开新课吗？还是他们在 default.aspx 页面后面？
@Jared 如果您刚开始，我会说最好的方法是使用 ajax 和 Web 服务，他们总是将您使用的方法描述为 low level example of how to pull data to highcharts highslide.com/forum/viewtopic.php?f=10&t=8649

标签： c# javascript .net highcharts

【解决方案1】：

xAxis 列表位于代码隐藏中。可能在页面加载时。

你提供的两个代码sn-ps：

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

和

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

进入要在其上显示图表的任何页面的代码隐藏。

【讨论】：

【解决方案2】：

我发现了另一种在 .NET 中生成图表的更简单方法。想象一下生成这样的图表；



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);

用 3 行绘制图表！

【讨论】：