花了点时间折腾出来的，记录一下结果，以免忘记：
客户端代码：
1 <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
2 <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
3 <script type="text/javascript" src="js/highcharts.js"></script>
4 <script type="text/javascript">
5 var chart;
6 $(function () {
7 var options = {
8 chart: {
9 renderTo: 'container',
10 type: 'line',
11 marginRight: 130,
12 marginBottom: 25
13 },
14 title: {
15 text: 'Monthly Average Temperature',
16 x: -20 //center
17 },
18 subtitle: {
19 text: 'Source: WorldClimate.com',
20 x: -20
21 },
22 xAxis: {
23 categories: []
24 },
25 yAxis: {
26 title: {
27 text: 'Temperature (°C)'
28 },
29 plotLines: [{
30 value: 0,
31 1,
32 color: '#808080'
33 }]
34 },
35 tooltip: {
36 formatter: function () {
37 return '<b>' + this.series.name + '</b><br/>' +
38 this.x + ': ' + this.y + '°C';
39 }
40 },
41 legend: {
42 layout: 'vertical',
43 align: 'right',
44 verticalAlign: 'top',
45 x: -10,
46 y: 100,
47 borderWidth: 0
48 },
49 series: []
50 };
51
52 $.get("getdata.aspx", { index: 1 }, function (data) {
53 data = data.split('&');
54 var data1 =eval(data[1]);
55 for (var i = 0; i < data1.length; i++) {
56 options.series.push(data1[i]);
57 }
58 var cate = data[0].split(',');
59 for (var i = 0; i < cate.length; i++) {
60 options.xAxis.categories.push(cate[i]);
61 }
62 chart = new Highcharts.Chart(options);
63 });
64 });
65 </script>
66 </asp:Content>
67 <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
68 <h2>
69 欢迎使用 ASP.NET!
70 </h2>
71
72
73 <div id="container" style="min- 400px; height: 400px; margin: 0 auto"></div>
74 </asp:Content>
2 <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
3 <script type="text/javascript" src="js/highcharts.js"></script>
4 <script type="text/javascript">
5 var chart;
6 $(function () {
7 var options = {
8 chart: {
9 renderTo: 'container',
10 type: 'line',
11 marginRight: 130,
12 marginBottom: 25
13 },
14 title: {
15 text: 'Monthly Average Temperature',
16 x: -20 //center
17 },
18 subtitle: {
19 text: 'Source: WorldClimate.com',
20 x: -20
21 },
22 xAxis: {
23 categories: []
24 },
25 yAxis: {
26 title: {
27 text: 'Temperature (°C)'
28 },
29 plotLines: [{
30 value: 0,
31 1,
32 color: '#808080'
33 }]
34 },
35 tooltip: {
36 formatter: function () {
37 return '<b>' + this.series.name + '</b><br/>' +
38 this.x + ': ' + this.y + '°C';
39 }
40 },
41 legend: {
42 layout: 'vertical',
43 align: 'right',
44 verticalAlign: 'top',
45 x: -10,
46 y: 100,
47 borderWidth: 0
48 },
49 series: []
50 };
51
52 $.get("getdata.aspx", { index: 1 }, function (data) {
53 data = data.split('&');
54 var data1 =eval(data[1]);
55 for (var i = 0; i < data1.length; i++) {
56 options.series.push(data1[i]);
57 }
58 var cate = data[0].split(',');
59 for (var i = 0; i < cate.length; i++) {
60 options.xAxis.categories.push(cate[i]);
61 }
62 chart = new Highcharts.Chart(options);
63 });
64 });
65 </script>
66 </asp:Content>
67 <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
68 <h2>
69 欢迎使用 ASP.NET!
70 </h2>
71
72
73 <div id="container" style="min- 400px; height: 400px; margin: 0 auto"></div>
74 </asp:Content>
服务器端的代码：
1 public void GetData()
2 {
3 StringBuilder sb = new StringBuilder();
4 //X轴显示的名称
5 sb.Append("Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec&");
6 //数据组合成JSON样式
7 sb.Append("[");
8 sb.Append("{name: 'test1',data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]},");
9 sb.Append("{name: 'test2',data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5] },");
10 sb.Append("{name: 'Berlin',data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]},");
11 sb.Append("{name: 'London',data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]}]");
12
13 Response.Write(sb);
14 }
2 {
3 StringBuilder sb = new StringBuilder();
4 //X轴显示的名称
5 sb.Append("Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec&");
6 //数据组合成JSON样式
7 sb.Append("[");
8 sb.Append("{name: 'test1',data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]},");
9 sb.Append("{name: 'test2',data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5] },");
10 sb.Append("{name: 'Berlin',data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]},");
11 sb.Append("{name: 'London',data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]}]");
12
13 Response.Write(sb);
14 }
主要是JSON样式的数据组合。
还有就是JS函数eval的用法。
options.series是一个数组，因此我们可以使用push方法，将转换后的数据加入进去,终于完成。