花了近一周时间专门研究.net 3.5平台提供的Chart控件的使用方法，感觉该控件的功能很强大，做出的图表效果也很美观，使用方法也并不复杂。如今先讲下Chart控件的部署及一些基本使用方法。
一、安装Chart控件所需的一些组件：
以上组件在MS站点上均有下载
安装完后打开VS2008，在工具箱中右键选项，加入关于MSCHART组件的两个选项，工具箱中即出现Chart组件。
PS:可下载MSChart.rar，Chart控件的学习手冊，内容很全面，涵盖全部关于Chart的用法
二、基本使用方法：
1.构建一个最简单的图表
%@ Page Language="C#" AutoEventWireup="true" CodeFile="1.aspx.cs" Inherits="ChartTest_1" %> <html> <head> <title>WebForm1</title> <meta content="Microsoft Visual Studio 7.0" name="GENERATOR"/> <meta content="C#" name="CODE_LANGUAGE"/> <meta content="JavaScript" name="vs_defaultClientScript"/> <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema"/> <link media="all" href="../../samples.css" mce_href="samples.css" type="text/css" rel="stylesheet" /> </head> <body> <p><asp:Chart ID="chart1" runat=server Height="296px" Width="595px" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" Palette=BrightPastel ImageType=Png BackSecondaryColor=White BackGradientStyle=TopBottom BackColor="#D3DFF0" BorderlineColor="26,59,105" > <Legends> <asp:Legend IsTextAutoFit=false Name="Default" BackColor="Transparent" Font="Trebuchet MS,8.25pt,style=Bold"></asp:Legend> </Legends> <BorderSkin SkinStyle=Emboss /> <Series> <asp:Series Name="Column" BorderColor="180,26,59,105"> <Points> <asp:DataPoint YValues="45" /> <asp:DataPoint YValues="34" /> <asp:DataPoint YValues="67" /> <asp:DataPoint YValues="31" /> <asp:DataPoint YValues="27" /> <asp:DataPoint YValues="87" /> <asp:DataPoint YValues="45" /> <asp:DataPoint YValues="32" /> </Points> </asp:Series> </Series> <ChartAreas> <asp:ChartArea Name="ChartArea1" BorderColor="64,64,64,64" BorderDashStyle=Solid BackSecondaryColor=White BackColor="64,165,191,228" ShadowColor=Transparent BackGradientStyle=TopBottom> <Area3DStyle Rotation="10" Perspective="10" Inclination="15" IsRightAngleAxes=false WallWidth="0" IsClustered=false /> <AxisY LineColor="64,64,64,64"> <LabelStyle Font="Trebuchet MS,8.25pt,style=Bold" /> <MajorGrid LineColor="64,64,64,64" /> </AxisY> <AxisX LineColor="64,64,64,64"> <LabelStyle Font="Trebuchet MS,8.25pt,style=Bold" /> <MajorGrid LineColor="64,64,64,64" /> </AxisX> </asp:ChartArea> </ChartAreas> </asp:Chart> </p> </body> </html>
.cs代码
using System; using System.Collections; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; using System.Web.UI.DataVisualization.Charting; public partial class ChartTest_1 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { Series series = new Series("Spline"); series.ChartType = SeriesChartType.Spline; series.BorderWidth = 3; series.ShadowOffset = 2; series.Points.AddY(45); series.Points.AddY(34); series.Points.AddY(67); series.Points.AddY(31); series.Points.AddY(27); series.Points.AddY(87); series.Points.AddY(45); series.Points.AddY(32); chart1.Series.Add(series); } }
2.直接在.cs代码中构建图表
using System; using System.Collections; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; using System.Web.UI.DataVisualization.Charting; public partial class ChartTest_2 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { Chart Chart1 = new Chart(); Chart1.Width = 600; Chart1.Height = 400; Chart1.RenderType = RenderType.ImageTag; //此属性决定MSChart生成的图形以何种方式送到client，有三种： //ImageTag，图形在服务端保存为暂时文件，并将暂时文件的URL作为HTML中<IMG>标签的SRC属性值。而此暂时文件的URL规则及暂时文件怎样生成可由ImageLocation属性确定。 //BinaryStreaming，不在服务端生成图形文件，<IMG>标签的SRC属性值将指向还有一个负责生成图形的.aspx页面 //ImageMap，不显示实际的图形，仅创建图片热区（image map）。 //默认值是ImageTag，就是会在服务端生成暂时文件。 Chart1.ImageLocation = "..//..//TempImages//ChartPic_#SEQ(200,30)"; Chart1.Palette = ChartColorPalette.BrightPastel; Title t = new Title("灰常好", Docking.Top, new System.Drawing.Font("Trebuchet MS", 14, System.Drawing.FontStyle.Bold), System.Drawing.Color.FromArgb(26, 59, 105)); Chart1.Titles.Add(t); Chart1.ChartAreas.Add("Series 1"); Chart1.Series.Add("Series 1"); Chart1.Series.Add("Series 2"); Chart1.Series["Series 1"].Points.AddY(5); Chart1.Series["Series 1"].Points.AddY(8); Chart1.Series["Series 1"].Points.AddY(12); Chart1.Series["Series 1"].Points.AddY(6); Chart1.Series["Series 1"].Points.AddY(9); Chart1.Series["Series 1"].Points.AddY(4); Chart1.Series["Series 2"].Points.AddY(2); Chart1.Series["Series 2"].Points.AddY(6); Chart1.Series["Series 2"].Points.AddY(18); Chart1.Series["Series 2"].Points.AddY(16); Chart1.Series["Series 2"].Points.AddY(21); Chart1.Series["Series 2"].Points.AddY(14); Chart1.Series["Series 1"].ChartType = SeriesChartType.Bar; Chart1.Series["Series 2"].ChartType = SeriesChartType.Bar; //图表横向排列 Chart1.Series["Series 1"]["PointWidth"] = "0.6"; Chart1.Series["Series 2"]["PointWidth"] = "0.6"; //图表条柱粗细 Chart1.Series["Series 1"].IsValueShownAsLabel = true; Chart1.Series["Series 2"].IsValueShownAsLabel = true; //显示条柱代表数字 Chart1.Series["Series 1"]["BarLabelStyle"] = "Center"; Chart1.Series["Series 2"]["BarLabelStyle"] = "Center"; //数字显示在条柱中间 Chart1.ChartAreas["Series 1"].Area3DStyle.Enable3D = true; //显示3D效果 Chart1.Series["Series 1"]["DrawingStyle"] = "Cylinder"; Chart1.Series["Series 2"]["DrawingStyle"] = "Cylinder"; //更改条柱形状 Chart1.ChartAreas["Series 1"].Area3DStyle.IsRightAngleAxes = true; //更改图表视角 Chart1.ChartAreas["Series 1"].Area3DStyle.IsClustered = true; //更改条柱长度 Chart1.ChartAreas["Series 1"].AxisX.LabelStyle.IsEndLabelVisible = false; //去掉Y轴多余数字 Chart1.ChartAreas["Series 1"].Area3DStyle.Inclination = 80; //控制条柱粗细 Chart1.BorderSkin.SkinStyle = BorderSkinStyle.Emboss; Chart1.BorderlineColor = System.Drawing.Color.FromArgb(26, 59, 105); Chart1.BorderlineDashStyle = ChartDashStyle.Solid; Chart1.BorderlineWidth = 2; Chart1.Legends.Add("Legend1"); Chart1.Page = this; HtmlTextWriter writer = new HtmlTextWriter(Page.Response.Output); Chart1.RenderControl(writer); } }
4890
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
