分享ASP.NET學習筆記(9)WebPages圖表

零下一度
發布: 2017-05-27 15:46:59
原創
1529 人瀏覽過

圖片幫助器 - 眾多有用的ASP.NET Web幫助器之一。

圖表幫助器

在前面的章節中,您已經學習如何使用ASP.NET的「幫助器」。

前面已經介紹如何使用「WebGrid幫助器」在網格中顯示資料。

本章介紹如何使用「圖表幫助器」以圖形化的形式顯示資料。

「圖表幫助器」可以建立不同類型的具有多種格式化選項和標籤的圖表圖像。它可以創建面積圖,長條圖,長條圖,折線圖,餅圖等標準圖表,也可以創建像股票圖表這樣的更專業的圖表。

根據陣列建立圖表

下面的實例顯示了根據陣列資料顯示圖表所需的程式碼:

實例

@{ var myChart = new Chart(width: 600, height: 400) .AddTitle("Employees") .AddSeries(chartType: "column", xValue: new[] { "Peter", "Andrew", "Julie", "Mary", "Dave" }, yValues: new[] { "2", "6", "4", "5", "3" }) .Write(); }
登入後複製

新圖建立一個新的圖表物件並且設定它的寬度和高度

- AddTitle方法指定了圖表的標題

- AddSeries方法向圖表中增加資料

- chartType參數定義圖表的類型

- xValue參數定義x軸的名稱

- yValues參數定義y軸的名稱

- Write()方法顯示圖表

#根據資料庫建立圖表

您可以執行一個資料庫查詢,然後使用查詢結果中的資料來建立一個圖表:

實例

@{ var db = Database.Open("SmallBakery"); var dbdata = db.Query("SELECT Name, Price FROM Product"); var myChart = new Chart(width: 600, height: 400) .AddTitle("Product Sales") .DataBindTable(dataSource: dbdata, xField: "Name").Write();}
登入後複製

- var db = Database.Open開啟資料庫(將資料庫物件賦值給變數db)

- var dbdata = db.Query執行資料庫查詢並儲存結果在dbdata中

- 新圖建立一個新的圖表物件並且設定它的寬度與高度

- AddTitle方法指定了圖表的標題

- DataBindTable方法將資料來源綁定到圖表

- Write()方法顯示圖表

除了使用DataBindTable方法之外,另一種方法是使用AddSeries(請參閱前面的實例).DataBindTable更容易使用,但是AddSeries更靈活,因為您可以更明確地指定圖表和資料:

#實例

@{ var db = Database.Open("SmallBakery"); var dbdata = db.Query("SELECT Name, Price FROM Product"); var myChart = new Chart(width: 600, height: 400) .AddTitle("Product Sales") .AddSeries(chartType:"Pie", xValue: dbdata, xField: "Name", yValues: dbdata, yFields: "Price") .Write(); }
登入後複製

根據XML資料建立圖表

第三種建立圖表的方法是使用XML檔案作為圖表的資料:

實例

@using System.Data;@{var dataSet = new DataSet();dataSet.ReadXmlSchema(Server.MapPath("data.xsd"));dataSet.ReadXml(Server.MapPath("data.xml"));var dataView = new DataView(dataSet.Tables[0]);var myChart = new Chart(width: 600, height: 400).AddTitle("Sales Per Employee").AddSeries("Default", chartType: "Pie",xValue: dataView, xField: "Name",yValues: dataView, yFields: "Sales").Write();}}
登入後複製

【相關推薦】

1.ASP.NET免費影片教學

#2.分享ASP.NET學習筆記(1)--WebPages Razor

3.分享ASP.NET學習筆記(2)--WebPages 介紹

4.分享ASP.NET學習筆記(3)WebPages 佈局

5.分享ASP.NET學習筆記(4)資料夾

#6.分享ASP.NET學習筆記(5)全域頁面AppStart和PageStart

7.分享ASP.NET學習筆記(8)WebPages 幫助器

#

以上是分享ASP.NET學習筆記(9)WebPages圖表的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!