ASP.NET Web Pages - Chart 帮助器

Chart - 众多有用的 ASP.NET Web 帮助器之一。

Chart Helper

在前一章，您已经学到了如何使用一个 ASP.NET “帮助器”。

您已学到如何使用 “WebGrid 帮助器”在网格中显示数据。

本章讲解如何在图表中显示数据，通过使用 “Chart 帮助器”。

“Chart 帮助器”能够通过多种格式和标记创建不同类型的图表图片。它能够创建标准图表，比如面积图、条状图、柱形图、线图和饼图，以及更专业的图表（比如股票走势图）。

显示在图表中的数据可以是来自数组、数据库或文件中的数据。

来自数组的图表

下例展示的代码使用来自数组的数据显示图表：

အမှတ်

@{ 
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();
}

အမှတ် စတင်

new Chart အခြား ပုံပြင် အရာဝတ္တု ကို ဖန်တီးပြီး အကျယ်အဝန်း နှင့် အမြင့် ကို အစားထိုးသည်။

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 သတင်းအချက်အလက် အင်တာနက် အရာဝတ္တု ကို ဖွင့်ပြီး သတင်းအချက်အလက် အင်တာနက် အရာဝတ္တု ကို လက်ခံစားရန် အလို့ငှာ အသုံးပြုသည်။

var dbdata = db.Query သတင်းအချက်အလက် အင်တာနက် အရာဝတ္တု ကို အသုံးပြု၍ သတင်းစက် ကို အစီအစဉ်ကို ထိန်းသိမ်းပြီး အကျိုးဆက် ကို dbdata မှာ ကျန်ရှိစေသည်။

new Chart အခြား ပုံပြင် အရာဝတ္တု ကို ဖန်တီးပြီး အကျယ်အဝန်း နှင့် အမြင့် ကို အစားထိုးသည်။

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

အမှတ် စတင်