ASP.NET 网页 - 图表助手
图表助手 - 众多有用的 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();
}
运行示例 »
- 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 打开数据库（并将数据库对象赋给变量 db）
- 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();}
}
运行示例 »
图表对象参考
| 辅助 | 描述 |
|---|---|
| Chart(width, height [, template] [, templatePath]) | 初始化图表。 |
| Chart.AddLegend([title] [, name]) | 向图表添加图例。 |
| Chart.AddSeries([name] [, chartType] [, chartArea] [, axisLabel] [, legend] [, markerStep] [, xValue] [, xField] [, yValues] [, yFields] [, options]) |
向图表添加一组值。 |
