(四)、讀取資料庫資料並在HighCharts上顯示
在上一篇簡單的靜態例子中，大家應該可以看得出，圖表裡橫縱座標的資料都是靜態的幾個資料，因此我們只要從資料庫讀取出我們想要的橫縱座標值，然後動態賦給Chart就行了。
X軸：
xAxis: {
categories: ['週一', '週二', '週三', '週四', '週五', '週六', '週日' ], //X軸的座標值
title: {text: '週數'}, //X軸座標標題
}
Y軸：
yAxis: {
title: {text: '人數(人)'}, //Y軸座標標題
}
主標題：
title: { text: '圖表主標題' }, //圖表主標題
副標題：
subtitle: {text: '圖表子標題' }, //圖表副標題
Y軸資料：
series:[{ name: '人數', data: [20, 40, 30, 90, 100, 60, 50] }]
這些值我們都可以從資料庫獲得資料，然後動態繫結上去即可，這裡後臺程式碼中最常用的是StringBuilder，通過它來拼湊出要繫結的資料
X軸：
xAxis: {
categories: <%= XAxisCategories %>
title: <%=Xtitle %> , //X軸座標標題
}
Y軸：
yAxis: {
title:<%=Ytitle %>
, //Y軸座標標題
}
主標題：
title: <%=title %> , //圖表主標題
副標題：
subtitle: <%=subtitle %> , //圖表副標題
Y軸資料：
series:<%= seriesData.ToString() %>
下面給出獲取X軸、Y軸、標題的方法：
public string XAxisCategories = ""; //X軸
public StringBuilder seriesData = new StringBuilder(); //Y軸
public string title = ""; // 圖表標題
...
標題獲取
title = "{text: '" + "<font color=red>"+site_name +"</font>"+"'}"; //紅色標記的部分是從資料庫動態獲取的，怎麼獲取，該獲取什麼，根據你需要，你應該懂的
X軸獲取：
StringBuilder xAxisCategories = new StringBuilder();
xAxisCategories.Append("[");
...
foreach (DataRowView drv in ds.Tables[0].DefaultView)
{
xAxisCategories.Append("'");
xAxisCategories.Append(drv["週數"] == null ? "0" : drv["週數"].ToString());
xAxisCategories.Append("',");
}
XAxisCategories = xAxisCategories.Replace(",", "", xAxisCategories.Length - 1, 1).Append("]").ToString(); //這裡是去掉最後一個多餘的逗號（,）
Y軸獲取：
StringBuilder yAxisCategories = new StringBuilder();
...
foreach (DataRowView drv in ds.Tables[0].DefaultView)
{
yAxisCategories.Append(drv["人數"] == null ? "0" : drv["人數"].ToString());
yAxisCategories.Append(",");
}
seriesData.Append("[{name: '人數',type: 'spline',data: [");
seriesData.Append(yAxisCategories.Replace(",", "", yAxisCategories.Length - 1, 1)); //去除最後一個逗號(，)
seriesData.Append("]}]");