ylbtech-.Net-ASP.NET Web Pages:Chart 帮助器
1.返回顶部
1、

ASP.NET Web Pages - Chart 帮助器


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


Chart 帮助器

在前面的章节中,您已经学习了如何使用 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 打开数据库(将数据库对象赋值给变量 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();}
}

运行实例 »

2、
2.返回顶部
1、
2、
3.返回顶部
 
 
11.返回顶部
 
作者:ylbtech
出处:http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

ASP.NET Web Pages:Chart 帮助器的更多相关文章

  1. ASP.NET Web Pages:帮助器

    ylbtech-.Net-ASP.NET Web Pages:帮助器 1.返回顶部 1. ASP.NET Web Pages - 帮助器 Web 帮助器大大简化了 Web 开发和常见的编程任务. AS ...

  2. ASP.NET Web Pages:WebMail 帮助器

    ylbtech-.Net-ASP.NET Web Pages:WebMail 帮助器 1.返回顶部 1. ASP.NET Web Pages - WebMail 帮助器 WebMail 帮助器 - 众 ...

  3. ASP.NET Web Pages:WebGrid 帮助器

    ylbtech-.Net-ASP.NET Web Pages:WebGrid 帮助器 1.返回顶部 1. ASP.NET Web Pages - WebGrid 帮助器 WebGrid - 众多有用的 ...

  4. Displaying Data in a Chart with ASP.NET Web Pages (Razor)

    This article explains how to use a chart to display data in an ASP.NET Web Pages (Razor) website by ...

  5. ASP.NET Web Pages:C# 和 VB 实例

    ylbtech-.Net-ASP.NET Web Pages:C# 和 VB 实例 1.返回顶部 1. ASP.NET Web Pages - C# 和 VB 实例 通过 C# 和 Visual Ba ...

  6. ASP.NET Web Pages (Razor) API Quick Reference

    ASP.NET Web Pages (Razor) API Quick Reference By Tom FitzMacken|February 10, 2014 Print This page co ...

  7. 如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites]

    如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites] 一.布局页面介绍[Abo ...

  8. 五张图概括 什么是 ASP 、 ASP.NET (Web Pages,Web Forms ,MVC )

    当你看懂下面这五张图,我相信你对于学习.NET Web开发路线将不陌生!                                               来源: http://www.w3 ...

  9. ASP.NET Web Pages 的冲突版本问题

    随着VS版本和.NET MVC版本.EF的版本的不断更新,虽然很多功能随着版本的提升而更完善,但对于旧版本开发的软件就有点悲催了,或许很多开发者都遇到类似的问题! 最近有一个项目是用.NET MVC3 ...

随机推荐

  1. Android中判断字符是否为中文、韩文、日文

    我们经常需要在程序中判断一个字符是否为CJK(Chinese.Japanese.Korean)语言的字符. 例如,在Contacts里面程序需要判断联系人姓名的所属语言. 今天为大家介绍一种NameS ...

  2. 2019.1.11 EDVT

    Processing Gain and Occupied Bandwidth ESA Basic Setup (11b)Span 110MHzRBW 100kHzVBW 100kHzSweep Tim ...

  3. python打包成.exe

    pyuic5 mainwindow.ui -o test.py pip install pyinstaller pyinstaller -F -w ***.py https://blog.csdn.n ...

  4. OK335xS GPMC nand device register hacking

    /********************************************************************************* * OK335xS GPMC na ...

  5. git中的needs merge问题

    这个问题是在先“储藏”起来了,后面再调用出来出现的错误. 解决的方法就是通过git add    ,git commit -m  提交上去就可以了.

  6. [LeetCode&Python] Problem 104. Maximum Depth of Binary Tree

    Given a binary tree, find its maximum depth. The maximum depth is the number of nodes along the long ...

  7. Rx.NET响应式编程

    响应式编程 Rx.NET 了解下 1. 引言 An API for asynchronous programming with observable streams.ReactiveX is a co ...

  8. wireshark 抓包过滤器

    wireshark 抓包过滤器 https://www.cnblogs.com/laoxiajiadeyun/p/10365073.html 过滤器分为抓包过滤器和显示过滤器,抓包过滤器会将不满足过滤 ...

  9. Ubuntu Linux下的Wireshark使用drcom_2011.lua分析drcom协议

    用文本编辑器打开init.lua配置文件,位置一般是//usr/share/wireshark/init.lua: sudo vim /usr/share/wireshark/init.lua 在in ...

  10. 好使-利用python 下paramiko模块无密码登录

    [root@salt-minion02 paramiko]# vim baoleiji4.py # -*- coding:utf-8 -*-import paramikoprivate_key = p ...