使用DevExpress的WebChartControl控件绘制图表(柱状图、折线图、饼图)

合集下载

dev chartcontrol用法 -回复

dev chartcontrol用法-回复“dev chartcontrol用法”指的是在软件开发中使用ChartControl来绘制图表和数据可视化。

ChartControl是一种功能强大的控件，可以在应用程序中显示各种类型的图表，帮助用户更直观地理解和分析数据。

本文将逐步介绍dev chartcontrol的用法，帮助读者快速上手。

第一步：了解ChartControl的基本功能ChartControl提供了许多基本功能，包括绘制线性图表、柱状图、饼图、雷达图等等。

在开始使用ChartControl之前，首先需要了解每种图表类型的特点和用途。

比如，线性图表适合显示数据的趋势和变化，柱状图适合比较不同类别或时间段的数据，饼图适合显示数据的占比等等。

熟悉这些基本功能将有助于我们选择合适的图表类型来展示数据。

第二步：创建ChartControl使用ChartControl之前，我们需要在项目中引入相应的库文件，并在界面上配置ChartControl控件。

一般来说，ChartControl可以使用拖拽的方式添加到界面上，然后通过代码进行配置和数据的绑定。

在创建ChartControl时，我们也可以设置其外观和交互方式，例如修改图表的标题、坐标轴的标签和范围，调整图表的宽度和高度，以及启用或禁用鼠标交互等。

第三步：准备数据源在使用ChartControl之前，需要准备好要显示的数据源。

这可以是来自数据库、文件或者其他数据源的数据集。

我们需要将这些数据转换为ChartControl可以识别和展示的格式。

通常情况下，ChartControl接受的数据格式包括DataTable、DataView和BindingSource等，可以根据具体情况选择合适的数据格式。

如果需要实时更新图表数据，还可以使用DataBinding机制将图表控件与数据源关联起来。

第四步：绘制图表在准备好数据源后，我们可以开始使用ChartControl绘制图表了。

使用DevExpress的WebChartControl控件绘制图表(柱状图、折线图、饼图)

使用DevExpress的WebChartControl控件绘制图表(柱状图、折线图、饼图)WebChartControl是DevExpress控件群下的一个Web图表控件，它使用非常的方便，生成的图表也相当的漂亮。

先贴出几张WebChartControl生成的图表：Web页面代码WebChartControl.aspx：View Code1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebChartControl.aspx.cs" Inherits="DevDemo.WebChartControl" %>23<%@ Register Assembly="DevExpress.XtraCharts.v11.2.Web, Version=11.2.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"4Namespace="DevExpress.XtraCharts.Web" TagPrefix="dxchartsui" %>56<%@ Register assembly="DevExpress.XtraCharts.v11.2, Version=11.2.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.XtraCharts" tagprefix="cc1" %> 78<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">910<html xmlns="/1999/xhtml">11<head runat="server">12<title></title>13</head>14<body>15<form id="form1"runat="server">16<div>17<dxchartsui:WebChartControl ID="WebChartControl1"runat="server" Width="500px"Height="350px">18</dxchartsui:WebChartControl>1920<dxchartsui:WebChartControl ID="WebChartControl3"runat="server" Width="500px"Height="350px">21</dxchartsui:WebChartControl>22<dxchartsui:WebChartControl ID="WebChartControl2"runat="server" Width="500px"Height="350px">23</dxchartsui:WebChartControl>24<dxchartsui:WebChartControl ID="WebChartControl4"runat="server" Width="500px"Height="350px">25</dxchartsui:WebChartControl>26</div>27</form>28</body>29</html>Web页面后台代码WebChartControl.aspx.csView Code1using System;2using System.Collections.Generic;3using System.Linq;4using System.Web;5using System.Web.UI;6using System.Web.UI.WebControls;7using System.Data;8using DevExpress.XtraCharts;9using System.Drawing;1011namespace DevDemo12 {13public partial class WebChartControl : System.Web.UI.Page14{15protected void Page_Load(object sender, EventArgs e)17this.DrawBar();18this.DrawLine();19this.DrawPie();20this.DrawBarAndLine();21}2223///<summary>24///绘制柱状图25///</summary>26private void DrawBar()27{2829ChartServices.SetChartTitle(this.WebChartControl1, true, "2012年12月第1周收入情况", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top, true, new Font("宋体", 12, FontStyle.Bold), Color.Red, 10); //如不需显示图表标题可不用调用本段代码，下同30ChartServices.DrawChart(this.WebChartControl1, "收益", ViewType.Bar, ServiceData.GetWeekMoneyAndCost(), "week", "money");31ChartServices.DrawChart(this.WebChartControl1, "成本", ViewType.Bar, ServiceData.GetWeekMoneyAndCost(), "week", "cost");32ChartServices.SetAxisX(this.WebChartControl1, true, StringAlignment.Center, "星期", Color.Red, true, new Font("宋体", 12, FontStyle.Bold)); //如不需显示X轴标题，可不调用该行代码，下同33ChartServices.SetAxisY(this.WebChartControl1, true, StringAlignment.Center, "金额", Color.Red, true, new Font("宋体", 12, FontStyle.Bold)); //如不需显示Y轴标题，可不调用该行代码，下同34}3536///<summary>37///绘制折线图38///</summary>39private void DrawLine()40{41ChartServices.SetChartTitle(this.WebChartControl3,true,"2012年12月第1周收入情况", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top, true, new Font("宋体", 12, FontStyle.Bold), Color.Red, 10);42ChartServices.DrawChart(this.WebChartControl3, "收益", ViewType.Line, ServiceData.GetWeekMoneyAndCost(), "week", "money");43ChartServices.DrawChart(this.WebChartControl3, "成本", ViewType.Line, ServiceData.GetWeekMoneyAndCost(), "week", "cost");44ChartServices.SetAxisX(this.WebChartControl3, true, StringAlignment.Center, "星期", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));45ChartServices.SetAxisY(this.WebChartControl3, true, StringAlignment.Center, "金额", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));4748///<summary>49///柱状图和折线图在同一图表中50///</summary>51private void DrawBarAndLine()52{53ChartServices.SetChartTitle(this.WebChartControl2,true,"2012年12月第1周收入情况", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top, true, new Font("宋体", 12, FontStyle.Bold), Color.Red, 10);54ChartServices.DrawChart(this.WebChartControl2, "收益", ViewType.Bar, ServiceData.GetWeekMoneyAndCost(), "week", "money");55ChartServices.DrawChart(this.WebChartControl2, "成本", ViewType.Bar, ServiceData.GetWeekMoneyAndCost(), "week", "cost");56ChartServices.SetAxisX(this.WebChartControl2, true, StringAlignment.Center, "星期", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));57ChartServices.SetAxisY(this.WebChartControl2, true, StringAlignment.Center, "金额", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));5859ChartServices.SetChartTitle(this.WebChartControl2,false,"2012年12月第1周收入情况", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top, true, new Font("宋体", 12, FontStyle.Bold), Color.Red, 10);60ChartServices.DrawChart(this.WebChartControl2, "收益", ViewType.Line, ServiceData.GetWeekMoneyAndCost(), "week", "money");61ChartServices.DrawChart(this.WebChartControl2, "成本", ViewType.Line, ServiceData.GetWeekMoneyAndCost(), "week", "cost");62ChartServices.SetAxisX(this.WebChartControl2, true, StringAlignment.Center, "星期", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));63ChartServices.SetAxisY(this.WebChartControl2, true, StringAlignment.Center, "金额", Color.Red, true, new Font("宋体", 12, FontStyle.Bold));64}6566///<summary>67///绘制饼图68///</summary>69private void DrawPie()70{71ChartServices.SetChartTitle(this.WebChartControl4,true,"2012年12月第1周收入情况", true, 2, StringAlignment.Center, ChartTitleDockStyle.Top,true,new Font("宋体", 12, FontStyle.Bold), Color.Red, 10);72ChartServices.DrawChart(this.WebChartControl4, ServiceData.GetWeekMoneyAndCost().Rows[0][0].ToString(), ViewType.Pie, ServiceData.GetWeekMoneyAndCost(), "week", "money");73}74}75 }数据提供类ServiceData.cs，主要作用为图表控件提供数据源View Code1using System;2using System.Collections.Generic;3using System.Linq;4using System.Web;5using System.Data;67namespace DevDemo8 {9public static class ServiceData10{11///<summary>12///获取一周收入和支出数据13///</summary>14///<returns>Datatable数据集合(可从数据库读取以datatable形式返回，此处为演示方便直接构造)</returns>15public static DataTable GetWeekMoneyAndCost()16{17DataTable dt = new DataTable();18dt.Columns.Add("week", typeof(string));19dt.Columns.Add("money", typeof(decimal));20dt.Columns.Add("cost", typeof(decimal));2122dt.Rows.Add("星期一", 1200,400);23dt.Rows.Add("星期二", 1800,750);24dt.Rows.Add("星期三", 890,320);25dt.Rows.Add("星期四", 1080,290);26dt.Rows.Add("星期五", 2800,1020);27dt.Rows.Add("星期六", 3200,1260);28dt.Rows.Add("星期日", 4500,2320);29return dt;30}31}32 }图表控件辅助类ChartServices.cs，控制生成图表View Code1using System;2using System.Collections.Generic;3using System.Linq;4using System.Web;5using System.Drawing;6using DevExpress.XtraCharts;7using System.Data;89namespace DevDemo10 {11public static class ChartServices12{13///<summary>14///绘制图形15///</summary>16///<param name="control">图表控件</param>17///<param name="seriesName">系列名</param>18///<param name="type">类型</param>19///<param name="dt">数据源</param>20///<param name="column1"></param>21///<param name="column2"></param>22public static void DrawChart(DevExpress.XtraCharts.Web.WebChartControl control, string seriesName, ViewType type, DataTable dt, string column1, string column2)23{24Series series = new Series(seriesName, type);25DataTable table = dt;26SeriesPoint point=null;27for (int i = 0; i < table.Rows.Count; i++)28{29point= new SeriesPoint(table.Rows[i][column1].ToString(), Convert.ToDouble(table.Rows[i][column2].ToString()));30series.Points.Add(point);31}32control.Series.Add(series);33//针对饼图的特殊处理34if(type==ViewType.Pie)35{36//设置显示方式(Argument:显示图例说明，ArgumentAndValues:显示图例内容和数据)bel.PointOptions.PointView = PointView.ArgumentAndValues; 38//设置数据显示形式(Percent:百分比,Currency:货币类型，数据前添加￥,Scientific:科学计数法)bel.PointOptions.V alueNumericOptions.Format = NumericFormat.Percent;40//数据是否保留小数(0：不保留小数位，1保留一位小数，2保留两位小数)bel.PointOptions.ValueNumericOptions.Precision = 0;4243//数据以百分比显示时只能是Default和None44((PieSeriesLabel)bel).ResolveOverlappingMode =ResolveOverlappingMode.Default;45}46}4748///<summary>49///设置图表标题50///</summary>51///<param name="control">图表控件</param>52//////<param name="isVisible">标题是否可见</param>53///<param name="text">标题文本</param>54///<param name="isWordWrop">是否换行</param>55///<param name="maxLineCount">最大允许行数</param>56///<param name="alignment">对齐方式</param>57///<param name="dock">位置</param>58///<param name="isAntialiasing">是否允许设置外观</param>59///<param name="font">字体</param>60///<param name="textColor">文本颜色</param>61///<param name="indent">字体缩进值</param>62public static void SetChartTitle(DevExpress.XtraCharts.Web.WebChartControl control,bool isVisible,String text, bool isWordWrop, int maxLineCount, StringAlignment alignment, ChartTitleDockStyle dock, bool isAntialiasing, Font font, Color textColor, int indent) 63{64//设置标题65ChartTitle title = new ChartTitle();66title.Visible = isVisible;67//显示文本68title.Text = text;69//是否允许换行70title.WordWrap = isWordWrop;71//最大允许行数72title.MaxLineCount = maxLineCount;73//对齐方式74title.Alignment = alignment;75//位置76title.Dock = dock;77//是否允许设置外观78title.Antialiasing = isAntialiasing;79//字体80title.Font = font;81//字体颜色82title.TextColor = textColor;83//缩进值84title.Indent = indent;85control.Titles.Add(title);86}878889///<summary>90///为X轴添加标题91///</summary>92///<param name="control">图形控件</param>93///<param name="isVisible">标题是否可见</param>94///<param name="aligment">对齐方式</param>95///<param name="text">标题显示文本</param>96///<param name="color">标题字体颜色</param>97///<param name="isAntialiasing">是否允许设置外观</param>98///<param name="font">字体</param>99public static void SetAxisX(DevExpress.XtraCharts.Web.WebChartControl control, bool isVisible, StringAlignment aligment, string text, Color color, bool isAntialiasing, Font font) 100{101XYDiagram xydiagram = (XYDiagram)control.Diagram;102xydiagram.AxisX.Title.Visible = isVisible;103xydiagram.AxisX.Title.Alignment = aligment;104xydiagram.AxisX.Title.Text = text;105xydiagram.AxisX.Title.TextColor = color;106xydiagram.AxisX.Title.Antialiasing = isAntialiasing;107xydiagram.AxisX.Title.Font = font;108}109110///<summary>111///为X轴添加标题112///</summary>113///<param name="control">图形控件</param>114///<param name="isVisible">标题是否可见</param>115///<param name="aligment">对齐方式</param>116///<param name="text">标题显示文本</param>117///<param name="color">标题字体颜色</param>118///<param name="isAntialiasing">是否允许设置外观</param>119///<param name="font">字体</param>120public static void SetAxisY(DevExpress.XtraCharts.Web.WebChartControl control, bool isVisible, StringAlignment aligment, string text, Color color, bool isAntialiasing, Font font) 121{122XYDiagram xydiagram = (XYDiagram)control.Diagram;123xydiagram.AxisY.Title.Visible = isVisible;124xydiagram.AxisY.Title.Alignment = aligment;125xydiagram.AxisY.Title.Text = text;126xydiagram.AxisY.Title.TextColor = color;127xydiagram.AxisY.Title.Antialiasing = isAntialiasing;128xydiagram.AxisY.Title.Font = font;129}130}131 }以上为本人的一点小小研究，如有不足之处，望不吝赐教！可详见/huabao-wei/archive/2012/12/17/DevWebChartControl.html。

DevExpress.XtraCharts使用心得

DevExpress.XtraCharts使用心得using System;using System.Collections.Generic;using ponentModel;using System.Data;using System.Drawing;using System.Text;using System.Windows.Forms;using DevExpress.XtraCharts;namespace ChartControl{public partial class Form1 : Form{public Form1(){InitializeComponent();}private Dictionary<string, double> chartPieDataDic = new Dictionary<string, double>();private Dictionary<string, double> chartBarDataDic = new Dictionary<string, double>();private void Form1_Load(object sender, EventArgs e){comboBox1.SelectedIndex = 0;InitPieChartData();InitBarChartData();showPie();}private void showPie(){ChartTitle title = new ChartTitle();title.Text = "全省话务分析饼图-话务类型分布";chartControl1.Titles.Clear();chartControl1.Titles.Add(title);Series series1 = new Series("话务类型", ViewType.Pie);((PiePointOptions)series1.PointOptions).PointView = PointView.ArgumentAndValues;foreach (KeyValuePair<string, double> keyvalue in chartPieDataDic){series1.Points.Add(new SeriesPoint(keyvalue.Key, new double[] { keyvalue.Value }));}chartControl1.Series.Clear();chartControl1.Series.Add(series1);}private void InitPieChartData(){try{chartPieDataDic.Add("大连", 0.2);chartPieDataDic.Add("沈阳", 0.26);chartPieDataDic.Add("锦州", 0.15);chartPieDataDic.Add("盘锦", 0.15);chartPieDataDic.Add("本溪", 0.1);chartPieDataDic.Add("抚顺", 0.12);chartPieDataDic.Add("营口", 0.02);}catch { }}private void InitBarChartData(){try{chartBarDataDic.Add("2001", 0.05);chartBarDataDic.Add("2002", 0.02);chartBarDataDic.Add("2003", 0.08);chartBarDataDic.Add("2004", 0.15);chartBarDataDic.Add("2005", 0.1);chartBarDataDic.Add("2006", 0.3);chartBarDataDic.Add("2007", 0.2);chartBarDataDic.Add("2008", 0.1);}catch { }}private void comboBox1_SelectedIndexChanged(object sender, EventArgs e){if (comboBox1.Text.IndexOf("饼图") != -1){showPie();}else if (comboBox1.Text.IndexOf("柱图") != -1){showBar();}else if (comboBox1.Text.IndexOf("线图") != -1){showLine();}else if (comboBox1.Text.IndexOf("点图") != -1){showPoint();}}private void showBar(){try{ChartTitle title = new ChartTitle();title.Text = "市网元容量增长率统计分析柱图";chartControl1.Titles.Clear();chartControl1.Titles.Add(title);Series series2 = new Series("大连", ViewType.Bar);Series series3 = new Series("沈阳", ViewType.Bar);Series series4 = new Series("本溪", ViewType.Bar);foreach (KeyValuePair<string, double> kvp in chartBarDataDic){series2.Points.Add(new SeriesPoint(kvp.Key, new double[] {kvp.Value}));series3.Points.Add(new SeriesPoint(kvp.Key, new double[] {kvp.Value + 0.08}));series4.Points.Add(new SeriesPoint(kvp.Key, new double[] {kvp.Value + 0.02}));}chartControl1.Series.Clear();chartControl1.Series.Add(series2);chartControl1.Series.Add(series3);chartControl1.Series.Add(series4);chartControl1.Legend.Visible = true; // 显示标签(旁边的标注哪个颜色代表哪个城市)}catch { }}private void showLine(){ChartTitle title = new ChartTitle();title.Text = "线图";chartControl1.Titles.Clear();chartControl1.Titles.Add(title);Series series1 = new Series("辽宁", ViewType.Line);series1.ArgumentScaleType = ScaleType.Numerical;series1.Points.Add(new SeriesPoint(1, new double[] { 10 }));series1.Points.Add(new SeriesPoint(2, new double[] { 12 }));series1.Points.Add(new SeriesPoint(3, new double[] { 14 }));series1.Points.Add(new SeriesPoint(4, new double[] { 17 }));series1.Points.Add(new SeriesPoint(5, new double[] { 21 }));series1.Points.Add(new SeriesPoint(6, new double[] { 26 }));series1.Points.Add(new SeriesPoint(7, new double[] { 29 }));series1.Points.Add(new SeriesPoint(8, new double[] { 30 }));((PointSeriesView)series1.View).PointMarkerOptions.Kind = MarkerKind.Triangle;Series series2 = new Series("山东", ViewType.Line);series2.ArgumentScaleType = ScaleType.Numerical; //这句话必须有,否则点画不出来.((LineSeriesView)series2.View).LineStyle.DashStyle = DashStyle.DashDotDot;series2.Points.Add(new SeriesPoint(1, new double[] { 4 }));series2.Points.Add(new SeriesPoint(2, new double[] { 14 }));series2.Points.Add(new SeriesPoint(3, new double[] { 17 }));series2.Points.Add(new SeriesPoint(4, new double[] { 22 }));series2.Points.Add(new SeriesPoint(5, new double[] { 20 }));series2.Points.Add(new SeriesPoint(6, new double[] { 15 }));series2.Points.Add(new SeriesPoint(7, new double[] { 18 }));series2.Points.Add(new SeriesPoint(8, new double[] { 11 }));((PointSeriesView)series2.View).PointMarkerOptions.Kind = MarkerKind.Cross;chartControl1.Series.Clear();chartControl1.Series.Add(series1);chartControl1.Series.Add(series2);chartControl1.Legend.Visible = true;}private void showPoint(){ChartTitle title = new ChartTitle();title.Text = "点图";chartControl1.Titles.Clear();chartControl1.Titles.Add(title);Series series1 = new Series("上线人数", ViewType.Point);series1.ArgumentScaleType = ScaleType.Numerical;series1.Points.Add(new SeriesPoint(1, new double[] { 20 }));series1.Points.Add(new SeriesPoint(2, new double[] { 12 }));series1.Points.Add(new SeriesPoint(3, new double[] { 11 }));series1.Points.Add(new SeriesPoint(4, new double[] { 17 }));series1.Points.Add(new SeriesPoint(5, new double[] { 21 }));series1.Points.Add(new SeriesPoint(6, new double[] { 21 }));series1.Points.Add(new SeriesPoint(7, new double[] { 29 }));series1.Points.Add(new SeriesPoint(8, new double[] { 30 }));((PointSeriesView)series1.View).PointMarkerOptions.Kind = MarkerKind.Triangle;Series series2 = new Series("下线人数", ViewType.Point);series2.ArgumentScaleType = ScaleType.Numerical; //这句话必须有,否则点画不出来.series2.Points.Add(new SeriesPoint(1, new double[] { 4 }));series2.Points.Add(new SeriesPoint(2, new double[] { 14 }));series2.Points.Add(new SeriesPoint(3, new double[] { 17 }));series2.Points.Add(new SeriesPoint(4, new double[] { 22 }));series2.Points.Add(new SeriesPoint(5, new double[] { 20 }));series2.Points.Add(new SeriesPoint(6, new double[] { 15 }));series2.Points.Add(new SeriesPoint(7, new double[] { 18 }));series2.Points.Add(new SeriesPoint(8, new double[] { 11 }));((PointSeriesView)series2.View).PointMarkerOptions.Kind = MarkerKind.Cross;chartControl1.Series.Clear();chartControl1.Series.Add(series1);chartControl1.Series.Add(series2);chartControl1.Legend.Visible = true;}}}。

DevExpress之ChartControl实现柱状图演示实例

DevExpress之ChartControl实现柱状图演⽰实例本⽂实例讲述了DevExpress中ChartControl实现柱状图演⽰的⽅法。

分享给⼤家供⼤家参考。

具体实现⽅法如下：关键代码如下：复制代码代码如下:using System;using System.Data;using System.Windows.Forms;using CSharpUtilHelpV2;using DevExpress.XtraCharts;namespace DevExpressChart{public partial class winProduct : Form{public winProduct(){InitializeComponent();}static readonly string AccessFullPath = string.Format(@"{0}\Northwind.MDB",AppDomain.CurrentDomain.BaseDirectory);static DataTable ProductList = null;AccessUtilsV2 AccessHelper = null;private void winChat_Load(object sender, EventArgs e){AccessHelper = new AccessUtilsV2(AccessFullPath);ProductList = AccessHelper.ExecuteDataTable("select * from Products", null);BuilderDevChart();}private void BuilderDevChart(){if (ProductList != null){Series _barSeries = new Series("测试", ViewType.Bar);_barSeries.ArgumentDataMember = "ProductName";//x轴_barSeries.ValueDataMembers[0] = "UnitPrice";//Y轴_barSeries.DataSource = ProductList;_barSeries.AddDataFilter("CategoryID", 4, DataFilterCondition.Equal);_barSeries.SetColorEach(true);chartControl1.Series.Add(_barSeries);_barSeries.LegendPointOptions.PointView = PointView.ArgumentAndValues;//chartControl1.SeriesDataMember = "UnitPrice";//chartControl1.SeriesTemplate.ValueDataMembers[0] = "UnitPrice";//chartControl1.SeriesTemplate.ArgumentDataMember = "ProductName";//chartControl1.SeriesTemplate.ArgumentScaleType = ScaleType.Qualitative;//chartControl1.SeriesTemplate.AddDataFilter("CategoryID", 4, DataFilterCondition.Equal);//chartControl1.SeriesTemplate.LegendPointOptions.PointView = PointView.ArgumentAndValues;chartControl1.SetXLableAngle(-35);chartControl1.SetCrosshair(true);chartControl1.Legend.Direction = LegendDirection.LeftToRight;chartControl1.Legend.AlignmentHorizontal = LegendAlignmentHorizontal.Center;chartControl1.Legend.AlignmentVertical = LegendAlignmentVertical.BottomOutside;chartControl1.DataSource = ProductList;chartControl1.AddTitle("Product List");//--------------------------}}}}复制代码代码如下:using DevExpress.Utils;using DevExpress.XtraCharts;namespace DevExpressChart{public static class ChartUtils{/// <summary>/// 增加数据筛选/// </summary>/// <param name="SeriesBase">Series</param>/// <param name="columnName">列名称</param>/// <param name="value">列名称对应的筛选数值</param>/// <param name="dataFilterCondition">DataFilterCondition枚举</param>public static void AddDataFilter(this SeriesBase series, string columnName, object value, DataFilterCondition dataFilterCondition){series.DataFilters.Add(new DataFilter(columnName, value.GetType().FullName, dataFilterCondition, value)); }/// <summary>/// 设置X轴Lable⾓度/// </summary>/// <param name="chart">ChartControl</param>/// <param name="angle">⾓度</param>public static void SetXLableAngle(this ChartControl chart, int angle){XYDiagram _xyDiagram = (XYDiagram)chart.Diagram;if (_xyDiagram != null)_bel.Angle = angle;}/// <summary>/// 设置Y轴Lable⾓度/// </summary>/// <param name="chart">ChartControl</param>/// <param name="angle">⾓度</param>public static void SetYLableAngle(this ChartControl chart, int angle){XYDiagram _xyDiagram = (XYDiagram)chart.Diagram;_bel.Angle = angle;}/// <summary>/// 设置ColorEach/// </summary>/// <param name="chart">ChartControl</param>/// <param name="colorEach">是否设置成ColorEach</param>public static void SetColorEach(this Series series, bool colorEach){SeriesViewColorEachSupportBase colorEachView = (SeriesViewColorEachSupportBase)series.View;if (colorEachView != null){colorEachView.ColorEach = colorEach;}}/// <summary>/// 设置是否显⽰⼗字标线/// </summary>/// <param name="chart">ChartControl</param>/// <param name="crosshair">是否显⽰⼗字标线</param>public static void SetCrosshair(this ChartControl chart, bool crosshair){chart.CrosshairEnabled = crosshair ? DefaultBoolean.True : DefaultBoolean.False;chart.CrosshairOptions.ShowArgumentLabels = crosshair;chart.CrosshairOptions.ShowArgumentLine = crosshair;chart.CrosshairOptions.ShowValueLabels = crosshair;chart.CrosshairOptions.ShowValueLine = crosshair;}/// <summary>/// 新增ChartControl的Title⽂字/// </summary>/// <param name="chart">ChartControl</param>/// <param name="title">Title⽂字</param>public static void AddTitle(this ChartControl chart, string title){ChartTitle _title = new ChartTitle();_title.Text = title;chart.Titles.Add(_title);}/// <summary>/// 饼状Series设置成百分⽐显⽰/// </summary>/// <param name="series">Series</param>public static void SetPiePercentage(this Series series){if (series.View is PieSeriesView){((PiePointOptions)series.PointOptions).PercentOptions.ValueAsPercent = true;((PiePointOptions)series.PointOptions).ValueNumericOptions.Format = NumericFormat.Percent; ((PiePointOptions)series.PointOptions).ValueNumericOptions.Precision = 0;}}}}运⾏效果如下图所⽰：希望本⽂所述对⼤家的C#程序设计有所帮助。

devexpress chartcontrol 用法

devexpress chartcontrol 用法如何使用DevExpress ChartControl？一、简介DevExpress ChartControl是一个功能强大、灵活且易于使用的数据可视化控件，用于创建各种类型的图表，包括线图、柱状图、饼图、雷达图等。

它提供了丰富的图表样式和自定义选项，以满足各种应用程序的需求。

在本篇文章中，我们将一步一步地介绍如何使用DevExpress ChartControl。

二、安装和配置DevExpress ChartControl1. 下载DevExpress首先，我们需要从DevExpress官方网站下载并安装DevExpress。

在官方网站上，您可以找到适用于不同开发环境的DevExpress套件。

选择您正在使用的开发环境，并下载适合您的版本。

2. 添加DevExpress控件在安装DevExpress之后，打开您的开发环境（例如Visual Studio），创建一个新的项目或打开现有的项目。

然后，右键单击工具箱中的一个空白区域，选择“选择项”或“添加”选项。

在选择项对话框中，找到DevExpress组件，并选中“ChartControl”控件。

点击确定按钮，将DevExpress ChartControl添加到工具箱中。

3. 配置DevExpress控件接下来，将DevExpress ChartControl拖放到您的窗体或用户控件中。

然后，选择控件并在属性窗口中进行配置。

您可以设置控件的样式、布局、数据源等属性。

例如，您可以选择图表的风格（如3D或2D），调整图表的尺寸和位置，以及绑定数据源以显示图表数据。

三、创建基本图表1. 添加数据源要创建一个基本图表，首先需要添加一个数据源。

您可以使用任何数据源，例如DataSet、DataTable或自定义集合。

假设我们有一个包含销售数据的DataTable。

为了将数据绑定到图表，您需要设置图表的DataSource属性并指定要用于显示数据的数据源和数据字段。

DevExpress控件使用之多重坐标图形的绘制(ASPxWebChartControl)

DevExpress控件使用之多重坐标图形的绘制有时候，基于对一些年份、月份的统计，需要集成多个数值指标进行分析，因此就需要把多种数据放到一个图形里面展现，也成为多重坐标轴，多重坐标轴可以是多个X轴，也可以是Y轴，它们的处理方式类似。

本文通过一个例子对这个方面进行介绍，希望给大家有一个很好的参考。

首先我们先来看一个图形例子，我们可以从里面图形的右边看到有多个Y轴，一个Y轴代表一个指标分析，X轴为月份。

上图是采用了DevExpress的ChartControl图表控件来实现的，这个控件提供了SecondaryAxisY对象来处理多重坐标的问题。

1.准备数据并绑定首先，，拖动ChartControl控件到Form界面上，然后设计好布局。

下面为了测试准备了几项数据，绑定在下面列表GridControl对象里面，然后把数据绑定到图表对象里面，如下代码。

具体处理的时候，我们从数据库获取对应指标的数据即可实现动态绑定。

/// <summary>/// 准备数据内容/// </summary>/// <returns></returns>privateDataTableCreateData(){DataTabledt = new DataTable();dt.Columns.Add(new DataColumn("类型"));dt.Columns.Add(new DataColumn("2005-1月", typeof(decimal)));dt.Columns.Add(new DataColumn("2005-2月", typeof(decimal)));dt.Columns.Add(new DataColumn("2005-3月", typeof(decimal)));dt.Columns.Add(new DataColumn("2005-4月", typeof(decimal)));dt.Columns.Add(new DataColumn("2005-5月", typeof(decimal)));dt.Columns.Add(new DataColumn("2005-6月", typeof(decimal)));dt.Rows.Add(new object[] { "员工人数", 437, 437, 414,397, 387, 378 });dt.Rows.Add(new object[] { "人均月薪", 3964, 3961, 3979, 3974, 3967, 3972 });dt.Rows.Add(new object[] { "成本TEU", 3104, 1339, 3595.8, 3154.5, 2499.8, 3026 });dt.Rows.Add(new object[] { "人均生产率", 7.1, 3.06, 8.69,7.95, 6.46, 8.01 });dt.Rows.Add(new object[] { "占2005年3月人数比例", 1.06, 1.06, 1,0.96, 0.93, 0.91 });returndt;}private void Form1_Load(object sender, EventArgs e){DataTabledt = CreateData();this.gridControl1.DataSource = dt;CreateChart(dt);}2、创建图表图形private void CreateChart(DataTabledt){#region Series//创建几个图形的对象Series series1 = CreateSeries("员工人数", ViewType.Line, dt, 0);Series series2 = CreateSeries("人均月薪", ViewType.Line, dt, 1);Series series3 = CreateSeries("成本TEU", ViewType.Line, dt, 2);Series series4 = CreateSeries("人均生产率", ViewType.Line, dt, 3);Series series5 = CreateSeries("占2005年3月人数比例",ViewType.Line, dt, 4);#endregionList<Series> list = new List<Series>() { series1, series2, series3, series4, series5 };chartControl1.Series.AddRange(list.ToArray());chartControl1.Legend.Visible = false;belsVisibility =efaultBoolean.True;for (int i = 0; i <list.Count; i++){list[i].View.Color = colorList[i];CreateAxisY(list[i]);}}为了简化代码，并方便处理，上面代码中提取了两个函数进行了独立处理。

devexpress案例

devexpress案例DevExpress是一家软件开发工具提供商，为开发人员提供了一套功能强大的工具和控件，用于快速开发现代化的桌面和Web应用程序。

下面是十个与DevExpress案例相关的例子：1. DevExpress Grid Control：DevExpress的Grid Control是一个功能强大且高度可定制的数据网格控件。

它提供了各种功能，如排序、过滤、分组和编辑，使开发人员能够轻松地显示和操作大量数据。

2. DevExpress Chart Control：DevExpress的Chart Control是一个先进的图表控件，可以用于创建各种类型的图表，包括折线图、柱状图、饼图等。

开发人员可以使用该控件来可视化数据，并提供交互性和动画效果。

3. DevExpress Report Designer：DevExpress的Report Designer 是一个用于创建和设计报表的工具。

它提供了丰富的设计功能，包括布局、样式、数据绑定和表达式。

开发人员可以使用该工具轻松地创建漂亮和功能丰富的报表。

4. DevExpress Dashboard Designer：DevExpress的Dashboard Designer是一个用于创建仪表板的工具。

它提供了各种仪表板元素，如图表、指标和筛选器，使开发人员能够轻松地创建交互式和可视化的仪表板。

5. DevExpress Rich Text Editor：DevExpress的Rich Text Editor是一个功能强大的富文本编辑器，可以用于创建和编辑格式丰富的文本。

它支持各种文本样式、表格、图像和超链接，使开发人员能够创建复杂的文档。

6. DevExpress Scheduler Control：DevExpress的Scheduler Control是一个用于创建和管理日程安排的控件。

它提供了各种功能，如日历视图、预约管理和提醒功能，使开发人员能够轻松地管理时间和资源。

DevexpressChartControl柱状图简单例子

DevexpressChartControl柱状图简单例⼦ //using DevExpress.XtraEditors;//using DevExpress.XtraCharts;// Create an empty chart.ChartControl sideBySideBarChart = new ChartControl();// Create the first side-by-side bar series and add points to it.Series series1 = new Series("Side-by-Side Bar Series 1", ViewType.Bar);series1.Points.Add(new SeriesPoint("A", 10));series1.Points.Add(new SeriesPoint("B", 12));series1.Points.Add(new SeriesPoint("C", 14));series1.Points.Add(new SeriesPoint("D", 17));// Create the second side-by-side bar series and add points to it.Series series2 = new Series("Side-by-Side Bar Series 2", ViewType.Bar);series2.Points.Add(new SeriesPoint("A", 15));series2.Points.Add(new SeriesPoint("B", 18));series2.Points.Add(new SeriesPoint("C", 25));series2.Points.Add(new SeriesPoint("D", 33));// Add the series to the chart.sideBySideBarChart.Series.Add(series1);sideBySideBarChart.Series.Add(series2);// Hide the legend (if necessary).sideBySideBarChart.Legend.Visibility = DevExpress.Utils.DefaultBoolean.False;// Rotate the diagram (if necessary).//((XYDiagram)sideBySideBarChart.Diagram).Rotated = true;// Add a title to the chart (if necessary).ChartTitle chartTitle1 = new ChartTitle();chartTitle1.Text = "Side-by-Side Bar Chart";sideBySideBarChart.Titles.Add(chartTitle1);// Add the chart to the form.sideBySideBarChart.Dock = DockStyle.Fill; this.Controls.Add(sideBySideBarChart);。

DevExpress之ChartControl用法实例总结

DevExpress之ChartControl⽤法实例总结DevExpress中的ChartControl顾名思义就是数据基于图表展⽰，其关键在于Series上的处理。

本⽂实例展⽰了ChartControl的⽤法，具体内容如下：主要功能代码部分如下：using System;using System.Drawing;using DevExpress.XtraCharts;namespace DevExpressUtilHelpV3{public static class ChartToolV3{/// <summary>/// 创建Series/// </summary>/// <param name="chat">ChartControl</param>/// <param name="seriesName">Series名字『诸如：理论电量』</param>/// <param name="seriesType">seriesType『枚举』</param>/// <param name="dataSource">数据源</param>/// <param name="xBindName">ChartControl的X轴绑定</param>/// <param name="yBindName">ChartControl的Y轴绑定</param>public static void CreateSeries(this ChartControl chat, string seriesName, ViewType seriesType, object dataSource, string xBindName, string yBindName){CreateSeries(chat, seriesName, seriesType, dataSource, xBindName, yBindName, null);}/// <summary>/// 创建Series/// </summary>/// <param name="chat">ChartControl</param>/// <param name="seriesName">Series名字『诸如：理论电量』</param>/// <param name="seriesType">seriesType『枚举』</param>/// <param name="dataSource">数据源</param>/// <param name="xBindName">ChartControl的X轴绑定</param>/// <param name="yBindName">ChartControl的Y轴绑定</param>/// <param name="createSeriesRule">Series⾃定义『委托』</param>public static void CreateSeries(this ChartControl chat, string seriesName, ViewType seriesType, object dataSource, string xBindName, string yBindName, Action<Series> createSeriesRule) {if (chat == null)throw new ArgumentNullException("chat");if (string.IsNullOrEmpty(seriesName))throw new ArgumentNullException("seriesType");if (string.IsNullOrEmpty(xBindName))throw new ArgumentNullException("xBindName");if (string.IsNullOrEmpty(yBindName))throw new ArgumentNullException("yBindName");Series _series = new Series(seriesName, seriesType);_series.ArgumentScaleType = ScaleType.Qualitative;_series.ArgumentDataMember = xBindName;_series.ValueDataMembers[0] = yBindName;_series.DataSource = dataSource;if (createSeriesRule != null)createSeriesRule(_series);chat.Series.Add(_series);}}}代码使⽤⽰例如下：public Form1(){InitializeComponent();}private void Form1_Load(object sender, EventArgs e){DataTable _dt = CreateTestDB();chartControl1.CreateSeries("理论功率", ViewType.Spline, _dt, "time", "Power");chartControl1.CreateSeries("实际功率", ViewType.Spline, _dt, "time", "ActulPower");}/// <summary>/// 准备数据源/// </summary>/// <returns>DataTable</returns>private DataTable CreateTestDB(){DataTable _testData = new DataTable();_testData.Columns.Add(new DataColumn("time", typeof(string)));_testData.Columns.Add(new DataColumn("Power", typeof(decimal)));_testData.Columns.Add(new DataColumn("ActulPower", typeof(decimal)));Random _rm = new Random();for (int i = 0; i < 24; i++){DataRow _drNew = _testData.NewRow();_drNew["time"] = string.Format("{0}点", i);_drNew["Power"] = 250;_drNew["ActulPower"] = _rm.Next(220, 245);_testData.Rows.Add(_drNew);}return _testData;}上述代码运⾏效果如下图所⽰：。

chart控件画柱状图和饼图

chart控件画柱状图和饼图chart 控件画柱状图和饼图本文章主要讲解chart 控件画柱状图和饼图，代码分享给大家，有需要的朋友可以参考下，不足之处还望大家不吝赐教。

HTML部分：<ASP:Chart ID="ChartBar" runat="server" Width="800px" BackColor="#FFFFCC" Palette="BrightPastel" BorderWidth = "2" BorderColor = "#cc9900" ><Legends><asp:Legend IsTextAutoFit="False" Name="Default" BackCo lor="Transparent" Font="Trebuchet MS, 8.25pt, style=Bold"> </asp:Legend></Legends><ChartAreas><asp:ChartArea Name="ChartArea1"></asp:ChartArea></ChartAreas></asp:Chart><asp:Chart ID="ChartPie" runat="server" Width="400px" BackColor="#FFFFCC" Palette="BrightPastel" BorderWidth = "0" BorderColor = "#cc9900" ><Legends><asp:Legend IsTextAutoFit="False" Name="Default" BackCo lor="Transparent" Font="Trebuchet MS, 8.25pt, style=Bold"> </asp:Legend></Legends><ChartAreas><asp:ChartArea Name="ChartArea1"></asp:ChartArea></ChartAreas></asp:Chart>C#部分：//获取每月销售情况int[] arraySell=new int[]{10};//获取月份string[] arrayMonths = new string[] { "1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月" };//获取部门string[] arrayDeparts = new string[] { "部门1", "部门2", "部门3" };Series seriess = new Series("销售情况");seriess.BorderWidth = 3;seriess.ShadowOffset = 2;Series seriesPies = new Series("销售情况");seriesPies.ChartType = SeriesChartType.Pie;seriesPies.BorderWidth = 3;seriesPies.ShadowOffset = 2;this.ChartBar.Series.Add(seriess);this.ChartPie.Series.Add(seriesPies);Title tBar = new Title("销售情况柱状图");this.ChartBar.Titles.Add(tBar);Title tPie = new Title("销售情况饼状图");this.ChartPie.Titles.Add(tPie);this.ChartBar.ChartAreas["ChartArea1"].AxisX.Interval = 1;//x 轴数据显示间隔this.ChartBar.ChartAreas["ChartArea1"].AxisY.Interval = 50;//画柱状图foreach (string d in arrayDeparts){Series tempseries = new Series(string.Format("{0}", d));this.ChartBar.Series.Add(tempseries);foreach (string m in arrayMonths){foreach (int n in arraySell){tempseries.Points.AddXY(m, n);}}}//画饼图foreach (string d in arrayDeparts){foreach(int n in arraySell){seriesPies.Points.AddXY(d, n);}}this.ChartBar.ChartAreas["ChartArea1"].AxisX.IsMarginVisibl e = false;this.ChartBar.ChartAreas["ChartArea1"].Area3DStyle.Enable3 D = false;//背景色设置this.ChartBar.ChartAreas["ChartArea1"].ShadowColor = Colo r.Transparent;this.ChartBar.ChartAreas["ChartArea1"].BackColor = Color.A zure;this.ChartBar.ChartAreas["ChartArea1"].BackGradientStyle = GradientStyle.TopBottom;this.ChartBar.ChartAreas["ChartArea1"].BackSecondaryColor = Color.White;//X,Y坐标线颜色和大小this.ChartBar.ChartAreas["ChartArea1"].AxisX.LineColor = C olor.Blue;this.ChartBar.ChartAreas["ChartArea1"].AxisY.LineColor = Co lor.Blue;this.ChartBar.ChartAreas["ChartArea1"].AxisX.LineWidth = 2;this.ChartBar.ChartAreas["ChartArea1"].AxisY.LineWidth = 2;this.ChartBar.ChartAreas["ChartArea1"].AxisY.Title = "销量";//中间X,Y线条的颜色设置this.ChartBar.ChartAreas["ChartArea1"].AxisX.MajorGrid.LineColor = Color.Blue;this.ChartBar.ChartAreas["ChartArea1"].AxisY.MajorGrid.Line Color = Color.Blue;//X.Y轴数据显示间隔this.ChartBar.ChartAreas["ChartArea1"].AxisX.Interval = 1; / /X轴数据显示间隔this.ChartBar.ChartAreas["ChartArea1"].AxisY.Interval = 50;//X轴线条显示间隔this.ChartBar.ChartAreas["ChartArea1"].AxisX.MajorGrid.Inte rval = 1;效果/bbs/thread-5779-0-0.htmlchart显示多行多列的方法chart控件代码实现柱状图的方法。

WPFDevExpressChartControl

WPFDevExpressChartControl前端<dxc:ChartControl Grid.Row="1" Grid.Column="1" Name="LbarChart" BorderThickness="0" EnableAnimation="True" Background="#FF3D6DAF" ><dxc:ChartControl.CrosshairOptions><dxc:CrosshairOptions ShowArgumentLine="True" GroupHeaderPattern="{}时间: {A}"><dxc:monLabelPosition><dxc:CrosshairFreePosition DockTarget="{Binding ElementName=pane}"/></dxc:monLabelPosition></dxc:CrosshairOptions></dxc:ChartControl.CrosshairOptions><dxc:ChartControl.Diagram ><dxc:XYDiagram2D LabelsResolveOverlappingMinIndent="2" x:Name="Ldiagram"><dxc:XYDiagram2D.DefaultPane><dxc:Pane x:Name="Lpane" DomainBrush="#FF3D6DAF" Foreground="White" /></dxc:XYDiagram2D.DefaultPane><dxc:XYDiagram2D.AxisY><dxc:AxisY2D GridLinesMinorVisible="True"><dxc:AxisY2D.Title><dxc:AxisTitle Content="温度湿度线性图" /></dxc:AxisY2D.Title></dxc:AxisY2D></dxc:XYDiagram2D.AxisY><dxc:XYDiagram2D.AxisX><dxc:AxisX2D GridLinesVisible="True" /></dxc:XYDiagram2D.AxisX><dxc:XYDiagram2D.Series><dxc:LineSeries2D x:Name="LBarSideSerie"DisplayName="温度"MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}" AnimationAutoStartMode="SetStartState"><dxc:bel><dxc:SeriesLabel ConnectorVisible="False"ResolveOverlappingMode="Default" dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"Visible="{Binding ElementName=chbVisible, Path=IsChecked}" /></dxc:bel><dxc:LineSeries2D.Points></dxc:LineSeries2D.Points></dxc:LineSeries2D><dxc:LineSeries2D x:Name="LBarSideSerie2"DisplayName="湿度"MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}" AnimationAutoStartMode="SetStartState"><dxc:bel><dxc:SeriesLabel ConnectorVisible="False"ResolveOverlappingMode="Default" dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"Visible="{Binding ElementName=chbVisible, Path=IsChecked}" /></dxc:bel><dxc:LineSeries2D.Points></dxc:LineSeries2D.Points></dxc:LineSeries2D><dxc:LineSeries2D x:Name="LBarSideSerie3"DisplayName="压强"MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}" AnimationAutoStartMode="SetStartState"><dxc:bel><dxc:SeriesLabel ConnectorVisible="False"ResolveOverlappingMode="Default" dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"Visible="{Binding ElementName=chbVisible, Path=IsChecked}" /></dxc:bel><dxc:LineSeries2D.Points></dxc:LineSeries2D.Points></dxc:LineSeries2D></dxc:XYDiagram2D.Series></dxc:XYDiagram2D></dxc:ChartControl.Diagram><dxc:ChartControl.Legend><dxc:Legend HorizontalPosition="Right" Foreground="White" Background="{x:Null}" /></dxc:ChartControl.Legend></dxc:ChartControl>　后台绑定值///<summary>///坐标绑值///</summary>///<param name="TempData"></param>///<param name="BarSideSerie"></param>///<param name="diagram"></param>///<param name="Name"></param>///<param name="IsAddSecondaryY">是否添加第⼆坐标</param>public void SetBadingData(ParamVM TempData, LineSeries2D BarSideSerie, XYDiagram2D diagram, string Name, SolidColorBrush _brush, bool IsAddSecondaryY = true) {try{List<DevExpress.Xpf.Charts.SeriesPoint> lsBarPoint = new List<DevExpress.Xpf.Charts.SeriesPoint>(); //投⼊柱形图数据源List<PPPTS> lstPPPTS = new List<PPPTS>();#region温度List<DevChartData> lst = new List<DevChartData>();lst = TempData.Lst.OrderByDescending(a => a.StartTime).ToList();lsBarPoint.Clear();List<DevChartData> lst2 = new List<DevChartData>();foreach (var item in lst){lst2.Add(item);if (lst2.Count > 100) break;}lst2 = lst2.OrderBy(a => a.StartTime).ToList();foreach (var item in lst2){lsBarPoint.Add(new DevExpress.Xpf.Charts.SeriesPoint() { Argument = DataConvert.GetValDateTime(item.StartTime).ToString("HH:mm"), Value = DataConvert.GetValDouble(item.ProductionLong) });}BarSideSerie.Points.Clear();BarSideSerie.Points.AddRange(lsBarPoint);BarSideSerie.Animate();BarSideSerie.ArgumentScaleType = DevExpress.Xpf.Charts.ScaleType.Qualitative;belsVisibility = true;//显⽰标注标签belsVisibility = false;//显⽰标注标签BarSideSerie.Brush = _brush;//暂时不使⽤if (IsAddSecondaryY){#region是否添加第⼆坐标SecondaryAxisY2D ys = null;foreach (var item in diagram.SecondaryAxesY){if (item.Title.Content.ToString() == Name){ys = item;diagram.SecondaryAxesY.Remove(ys);break;}}SecondaryAxisY2D y1 = new SecondaryAxisY2D();y1.Alignment = AxisAlignment.Near;y1.FontSize = 12;y1.Title = new AxisTitle() { Content = Name };y1.Title.Foreground = _brush;y1.Title.FontSize = 12;y1.Title.Alignment = TitleAlignment.Far; //顶部对齐y1.Range = new AxisRange() { MaxValue = DataConvert.GetValDouble(TempData.theMax) * (1.2), MinValue = DataConvert.GetValDouble(TempData.theMin) * (0.8) };y1.Brush = _brush;y1.FontSize = 12;y1.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;y1.FontSize = 12;y1.OpacityMask = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;//AxisY.Visible = false;y1.Brush = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;bel = new AxisLabel();bel.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;y1.Title.Visible = true;y1.Visible = false;diagram.SecondaryAxesY.Add(y1);XYDiagram2D.SetSeriesAxisY(BarSideSerie, y1);#endregion}else{AxisY2D AxisY = ((DevExpress.Xpf.Charts.XYDiagram2D)diagram).ActualAxisY;DevExpress.Xpf.Charts.AxisRange _Range = new DevExpress.Xpf.Charts.AxisRange() { MaxValue = DataConvert.GetValDouble(TempData.theMax) * (1.2), MinValue = DataConvert.GetValDouble(TempData.theMin) * ( AxisY.Range = _Range;AxisY.Title = new AxisTitle() { Content = Name };AxisY.Title.FontSize = 12;AxisY.Title.Alignment = TitleAlignment.Far; //顶部对齐AxisY.Title.Foreground = _brush;AxisY.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;AxisY.FontSize = 12;AxisY.OpacityMask = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;AxisY.Brush = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;bel = new AxisLabel();bel.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;AxisY.Title.Visible = false;AxisY.Visible = true;};#endregion}catch (Exception){throw;}}。

devexpress winform用法

devexpress winform用法DevExpress WinForms 是一款功能强大的界面开发工具，它提供了丰富的控件和组件，可以帮助开发人员快速构建交互性强、美观的 Windows 窗体应用程序。

本文将介绍一些DevExpress WinForms 的常用用法和相关参考内容，帮助读者更好地理解和应用该工具。

一、控件和组件1. GridControl：GridControl 是DevExpress WinForms 的核心控件之一，用于显示和编辑数据。

它支持数据绑定、分组、排序、过滤、弹出式编辑等丰富的功能。

参考内容可以查阅DevExpress WinForms 的官方文档，其中包含详细的用法示例和教程。

2. BarManager：BarManager 是一个用于创建和管理菜单栏、工具栏和状态栏的组件。

它可以方便地进行布局、定制和样式设置。

参考内容可以查阅DevExpress WinForms 官方文档中的BarManager 相关章节，其中包括如何创建菜单栏、添加按钮和分隔符等操作。

3. ChartControl：ChartControl 是一个用于绘制各种类型图表的控件，例如折线图、柱状图、饼图等。

它提供了丰富的图表类型和样式设置选项，可以满足不同需求的数据可视化需求。

参考内容可以查阅DevExpress WinForms 官方文档中的ChartControl 相关章节，其中包括如何绑定数据、添加系列和设置图表样式等操作。

二、布局和样式1. LayoutControl：LayoutControl 是一个用于创建复杂布局的控件，可以将控件按照自定义的布局规则排列，并支持自动调整布局大小。

参考内容可以查阅DevExpress WinForms 官方文档中的LayoutControl 相关章节，其中包括如何定义布局规则、添加控件和设置布局样式等操作。

2. SkinEditor：SkinEditor 是一个用于定制皮肤的工具，可以为应用程序添加不同风格的界面。

dev chartcontrol用法

一、关于Dev ChartControlDev ChartControl是一款专业的图表控件，旨在为开发人员提供丰富多样的图表展示功能，帮助用户快速、方便地呈现各类数据。

该控件具有轻量、高性能、易操作等特点，广泛应用于各类软件开发项目中。

二、Dev ChartControl的使用场景1. 数据监控与展示Dev ChartControl适用于各种数据监控场景，可以帮助用户实时了解数据变化趋势，快速作出决策。

2. 业务报表制作开发人员可利用Dev ChartControl设计出美观、直观的业务报表，让数据更具说服力，更有利于业务分析和决策。

3. 全球信息站及移动端数据可视化Dev ChartControl支持网页和移动端的数据可视化展示，为用户提供了一种直观呈现数据的方式。

三、Dev ChartControl的基本功能1. 多种图表类型Dev ChartControl 支持折线图、柱状图、饼状图、雷达图等多种常见的图表类型，覆盖了大部分数据展示的需求。

2. 图表交互性用户可以通过鼠标悬停、点击、拖拽等操作与图表进行交互，更直观地感受数据的变化。

3. 自定义样式用户可根据需求自定义图表的样式，包括颜色、字体、标签等，使得图表更符合用户所在行业或公司的风格。

4. 数据导出Dev ChartControl支持数据导出为图片、PDF等格式，方便用户在不同场景下使用数据图表。

四、Dev ChartControl的使用方法1. 环境准备用户需要确保自己的开发环境中已经安装了Dev ChartControl所需的相关库和依赖。

2. 控件引入在项目中引入Dev ChartControl的相关库文件，并在页面中添加相应的标签或代码。

3. 数据绑定用户可以在后台代码中绑定数据源，并设置相关的图表展示属性。

4. 相关事件处理根据需求，用户可以对图表的各种交互事件进行处理，比如鼠标悬停、点击等。

5. 自定义样式根据需求，用户可以通过参数设置，自定义图表的样式，使其更符合项目需求。

devexpress chartcontrol 用法

devexpress chartcontrol 用法DevExpress ChartControl 是一款功能强大的图表控件，可以用于展示和分析数据。

本文将介绍 ChartControl 的使用方法和常见应用场景。

一、ChartControl 简介ChartControl 是 DevExpress 公司开发的一款用于显示图表的控件。

它内置了多种图表类型，如折线图、柱状图、饼图等，可以通过简单的配置实现复杂的数据可视化效果。

ChartControl 提供了丰富的功能和灵活的定制选项，适用于各种数据分析和展示的需求。

二、ChartControl 的基本使用ChartControl 的基本使用包括数据绑定、图表类型选择和图表样式调整。

1. 数据绑定：ChartControl 支持多种数据源的绑定方式，包括数据表、数据库、XML 文件等。

可以通过设置 ChartControl 的 DataSource 属性来指定数据源，同时指定 X 值和 Y 值字段，实现数据与图表的关联。

2. 图表类型选择：ChartControl 提供了多种预定义的图表类型，可以根据需求选择合适的图表类型。

可以通过 ChartControl 的 Series 属性进行设置，每个 Series 表示一个数据系列，可以设置对应的图表类型和数据源。

3. 图表样式调整：ChartControl 具有丰富的样式选项，可以对图表进行自定义的样式调整。

可以通过 ChartControl 的 Appearance 属性来设置整体的样式，也可以通过设置 Series 的 Appearance 属性来设置每个数据系列的样式。

以上是 ChartControl 的基本使用方法，通过简单的配置和调整，可以实现各种复杂的数据展示效果。

三、ChartControl 的高级特性除了基本的使用方法外，ChartControl 还提供了一些高级特性，可以进一步定制图表的显示效果和交互功能。

大白话C#--chartControl控件固定数据实现柱状图

大白话C#—chartControl控件固定数据实现柱状图【完整代码附在文档最后】大白话系列宗旨：打破自身基础高低的壁垒，用最简单白话的语言，让最低基础的童鞋也能轻松编程。

项目描述：chartControl是VS中DEV插件下的一个控件，可以实现在界面中的图表功能，本项目旨在通过chartControl控件搭配给定的数据变量从而实现简单柱状图的显示。

环境：VS2010、DEV11.1详细步骤（完整代码附在文档最后）：（完整代码附在文档最后）一、新建C #项目1、找到并打开VS2010软件，新建项目。

2、在弹出的窗口中左侧选择Visual C#下的Windows，然后在右侧选择“Windows窗体应用程序”，然后在下侧修改项目名称。

点击确定，即创建了一个窗体。

二、给窗体添加chartControl控件（完整代码附在文档最后）1、在主界面左侧找到工具箱（若无工具箱，可在主界面“视图”选项卡下选择“工具箱”即可显示），在工具箱中找到chartControl 控件双击，即可在窗体中添加该控件。

2、选择要展示的图表样式，本例选择饼状图，即图中的Pie。

3、chartControl控件在父容器中停靠。

三、进入代码编写（完整代码附在文档最后）1、在窗体上右键，选择“查看代码”，即可进入代码编写区。

2、初始代码主要是using引用部分和最基本的初始化InitializeComponent。

（完整代码附在文档最后）3、添加新的using引用，主要是【与数据库连接相关的usingSystem.Data.SqlClient】、【与DEV插件编辑相关的using DevExpress.XtraEditors】、【与chartControl控件相关的using DevExpress.XtraCharts】。

添加完成后如下图：4、对chartControl控件进行初始化。

初始化主要包括对控件数据源的定义（定义数据源为CreateDataSource（））、饼状图图的横纵坐标、指示数值的百分比样式展示及数值字体颜色、大小、背景色、边框等，同时也将图例的展示内容由展示数值修改为展示Name的各项。

Echarts柱状图配置详解

Echarts柱状图配置详解柱状图⽐如做成如下所⽰图：所有的基本配置如下：// 指定图表的配置项和数据var option = {// ---- 标题 -----title: {text: '主标题',textStyle: {color: 'red'},subtext: '副标题',subtextStyle: {color: 'blue'},padding: [0, 0, 10, 100] // 位置},// ---- legend ----legend: {type: 'plain', // 图列类型，默认为 'plain'top: '1%', // 图列相对容器的位置 top\bottom\left\rightselected: {// '销量': true // 图列选择，图形加载出来会显⽰选择的图列，默认为true},textStyle: { // 图列内容样式color: '#fff', // 字体颜⾊backgroundColor: 'black' // 字体背景⾊},tooltip: { // 图列提⽰框，默认不显⽰show: true,color: 'red'},data: [ // 图列内容{name: '销量',icon: 'circle',textStyle: {color: 'red', // 单独设置某⼀个图列的颜⾊backgroundColor: '#fff' // 单独设置某⼀个图列的字体背景⾊}}]},// --- 提⽰框 ----tooltip: {show: true, // 是否显⽰提⽰框，默认为truetrigger: 'item', // 数据项图形触发axisPointer: { // 指⽰样式type: 'shadow',axis: 'auto'},padding: 5,textStyle: { // 提⽰框内容的样式color: '#fff'}},// ---- gird区域 ---gird: {show: false, // 是否显⽰直⾓坐标系⽹格top: 80, // 相对位置 top\bottom\left\rightcontainLabel: false, // gird 区域是否包含坐标轴的刻度标签tooltip: {show: true,trigger: 'item', // 触发类型textStyle: {color: '#666'}}},// ------ X轴 ------xAxis: {show: true, // 是否显⽰position: 'bottom', // x轴的位置offset: 0, // x轴相对于默认位置的偏移type: 'category', // 轴类型，默认为 'category'name: '⽉份', // 轴名称nameLocation: 'end', // 轴名称相对位置nameTextStyle: { // 坐标轴名称样式color: 'red',padding: [5, 0, 0, -5]},nameGap: 15, // 坐标轴名称与轴线之间的距离nameRotate: 0, // 坐标轴名字旋转axisLine: { // 坐标轴轴线show: true, // 是否显⽰symbol: ['none', 'arrow'], // 是否显⽰轴线箭头symbolSize: [8, 8], // 箭头⼤⼩symbolOffset: [0, 7], // 箭头位置// ------ 线 ---------lineStyle: {color: 'blue',width: 1,type: 'solid'}},axisTick: { // 坐标轴刻度show: true, // 是否显⽰inside: true, // 是否朝内length: 3, // 长度lineStyle: { // 默认取轴线的样式color: 'red',width: 1,type: 'solid'}},axisLabel: { // 坐标轴标签show: true, // 是否显⽰inside: false, // 是否朝内rotate: 0, // 旋转⾓度margin: 5, // 刻度标签与轴线之间的距离color: 'red' // 默认取轴线的颜⾊},splitLine: { // gird区域中的分割线show: false, // 是否显⽰lineStyle: {// color: 'red',// width: 1,// type: 'solid'}},splitArea: { // ⽹格区域show: false// 是否显⽰，默认为false},data: ['1⽉', '2⽉', '3⽉', '4⽉', '5⽉', '6⽉', '7⽉', '8⽉', '9⽉', '10⽉', '11⽉', '12⽉'] },// ------ y轴 ----------yAxis: {show: true, // 是否显⽰position: 'left', // y轴位置offset: 0, // y轴相对于默认位置的偏移type: 'value', // 轴类型，默认为 ‘category’name: '销量', // 轴名称nameLocation: 'end', // 轴名称相对位置valuenameTextStyle: { // 坐标轴名称样式color: '#fff',padding: [5, 0, 0, 5] // 坐标轴名称相对位置},nameGap: 15, // 坐标轴名称与轴线之间的距离nameRotate: 270, // 坐标轴名字旋转axisLine: { // 坐标轴轴线show: true, // 是否显⽰// ----- 箭头 -----symbol: ['none', 'arrow'], // 是否显⽰轴线箭头symbolSize: [8, 8], // 箭头⼤⼩symbolOffset: [0, 7], // 箭头位置// ----- 线 -------lineStyle: {color: 'blue',width: 1,type: 'solid'}},axisTick: { // 坐标轴的刻度show: true, // 是否显⽰inside: true, // 是否朝内length: 3, // 长度lineStyle: {color: 'red', // 默认取轴线的颜⾊width: 1,type: 'solid'}},axisLabel: { // 坐标轴的标签show: true, // 是否显⽰inside: false, // 是否朝内rotate: 0, // 旋转⾓度margin: 8, // 刻度标签与轴线之间的距离color: 'red', // 默认轴线的颜⾊},splitLine: { // gird 区域中的分割线show: true, // 是否显⽰lineStyle: {color: '#666',width: 1,type: 'dashed'}},splitArea: { // ⽹格区域show: false// 是否显⽰，默认为false}},// ------- 内容数据 -------series: [{name: '销量', // 序列名称type: 'bar', // 类型legendHoverLink: true, // 是否启⽤图列 hover 时的联动⾼亮label: { // 图形上的⽂本标签show: false,position: 'insideTop', // 相对位置rotate: 0, // 旋转⾓度color: '#eee'},itemStyle: { // 图形的形状color: 'blue',barBorderRadius: [18, 18, 0 ,0]},barWidth: 20, // 柱形的宽度barCategoryGap: '20%', // 柱形的间距data: [3000, 4000, 4200, 4500, 6000, 5600, 4500, 5020, 4500, 5400, 4300, 1200] }]};html代码如下：<!DOCTYPE html><html><head><meta charset="utf-8"><title>ECharts</title><script src="./echarts4.x.js"></script><script type="text/javascript" src="./zhuzhangtu.js"></script></head><div id="main" style="width: 600px;height:400px;margin: 0 auto"></div> <script type="text/javascript">// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById('main'));// 使⽤刚指定的配置项和数据显⽰图表。

WebChartControl

WebChartControl因为在项目的我只遇到了饼状，柱状，线状三种图表所以我只试着学习了这三种方式的编写.第一步：下载WebChart控件；第二步：将WebChart.dll添加到工具箱它显示的控件名称为：ChartControl；第三步：新建WebForm，将工具箱中的ChartControl控件（即WebChart控件）添加到Default.aspx页面，并设置控件ID为ccPie，在属性控件器上设置ChartTitle为My Pie，XTitle为Month，YTitle 为Value等属性；第四步：在后台代码.cs文件中，添加 Using WebChart;第五步：现在来做饼状图表，它的实现可以说相当简单（像我这种智商的人都可以理解，所以说简单）如下：//填充饼状图表protected void showPie(){try{//创建一个饼状图表的实例PieChart chart = new PieChart();//绑定数据源chart.DataSource= this.getSingleData().Tables[0].DefaultView;//设置X轴所对应的字段chart.DataXValueField = "Month";chart.DataYValueField = "value";//设置是否显示图表各部分的值chart.DataLabels.Visible = true;//设置显示值的字体颜色chart.DataLabels.ForeColor = System.Drawing.Color.Blue; //设置是否显示阴影chart.Shadow.Visible = true;chart.DataBind();//将饼状图表添加到图表容器ccPie.Charts.Add(chart);//画出图表ccPie.RedrawChart();}catch (Exception exPie){throw new Exception(exPie.Message);}}protected DataSet getSingleData(){DataSet ds = new DataSet();Random rd = new Random(1);try{DataTable dt = new DataTable();dt.Columns.Add("Month", typeof(string));dt.Columns.Add("value", typeof(string));for (int i = 1; i < 13; i++){DataRow row = dt.NewRow();row[0] = i.T oString();row[1] = Convert.T oInt32(rd.NextDouble() * 100);dt.Rows.Add(row);}ds.Tables.Add(dt);}catch (Exception exD){Response.Write(exD.Message);}finally{ds.Dispose();}return ds;}以上代码的实现效果如下：图表各部分的颜色可以在将图表实例添加到图表容器前使用如下语句指定：chart.Colors = new Color[] { Color.Red, Color.Blue, Color.Yellow, Color.Cyan, Color.Black, Color.RosyBrown,Color.Green,Color.Pink,Color.Purple,Color.GreenYellow,Color.Navy,Color.YellowGreen };当然，为了使图表表现的更丰富你还可以通过设置其他属性来实现，好学的人们慢慢研究一下吧，嘻嘻至于柱状图表嘛也没什么太可记录的，忽略了，附件为源码；现在还是主要记录一下线状图吧，不是一条而是多线，嘿嘿在Defalut.aspx页面上添加WebChart控件，设置ID为ccLine .cs后台代码如下//填充线状图表protected void showLines(){try{DataSet ds = getMultiData();LineChart lc1 = new LineChart();lc1.Line.Color = Color.Green;lc1.Fill.Color = Color.Green;//设置在值点处线的显示形状lc1.LineMarker = new DiamondLineMarker(5, Color.Green, Color.Black);//设置图例的表示值，如果使用了图表中自带的样式，需要显示设置HasChartLegend来决定是否显示图例lc1.Legend = "Value 1";LineChart lc2 = new LineChart();lc2.Line.Color = Color.Blue;lc2.Fill.Color = Color.Blue;lc2.LineMarker = new CircleLineMarker(5, Color.Blue, Color.Green);lc2.Legend = "Value 2";LineChart lc3 = new LineChart();lc3.Line.Color = Color.Red;lc3.Fill.Color = Color.Red;lc3.LineMarker = new DiamondLineMarker(5, Color.Red, Color.Black);lc3.Legend = "Value 3";LineChart lc4 = new LineChart();lc4.Line.Color = Color.Purple;lc4.Fill.Color = Color.Purple;lc4.LineMarker = new DiamondLineMarker(8, Color.Purple, Color.Yellow);lc4.Legend = "Value 4";foreach (DataRow row in ds.Tables[0].Rows){lc1.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[1].T oString())));lc2.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[2].T oString())));lc3.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[3].T oString())));lc4.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[4].T oString())));}ccLine.Charts.Add(lc1);ccLine.Charts.Add(lc2);ccLine.Charts.Add(lc3);ccLine.Charts.Add(lc4);ccLine.RedrawChart();}catch (Exception exPie){Response.Write(exPie.Message);}}===============================页面==============================<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@ Register Assembly="WebChart" Namespace="WebChart" TagPrefix="Web" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""><html xmlns="" ><head runat="server"><title>学习如何制作web图表</title></head><body><form id="form1" runat="server"><div><table><tr><td style="width: 100px"><asp:GridView ID="gvPie" runat="server"></asp:GridView></td><td style="width: 100px"><Web:ChartControl ID="ccPie" runat="server" BorderStyle="Outset" BorderWidth="5px"GridLines="None" Height="400px" LeftChartPadding="20" Padding="20" Width="500px"><YAxisFont StringFormat="Far,Near,Character,LineLimit" /> <ChartTitle StringFormat="Center,Near,Character,LineLimit"<XAxisFont StringFormat="Center,Near,Character,LineLimit" /><Background Color="LightSteelBlue" /><YTitleStringFormat="Center,Near,Character,DirectionVertical"Text="Value" /><XTitle StringFormat="Center,Near,Character,LineLimit" Text="Month" /></Web:ChartControl></td></tr><tr><td style="width: 100px"><asp:GridView ID="gvColumn" runat="server"></asp:GridView></td><td style="width: 100px"><Web:ChartControl ID="ccColumn" runat="server" BorderStyle="Outset" BorderWidth="5px"Height="400px" Padding="20" Width="500px"><YAxisFont StringFormat="Far,Near,Character,LineLimit" /> <XTitle StringFormat="Center,Near,Character,LineLimit" Text="Month" /><ChartTitle StringFormat="Center,Near,Character,LineLimit" Text="My Column" /><XAxisFont StringFormat="Center,Near,Character,LineLimit" /><Background Color="LightSteelBlue" /><YTitleStringFormat="Center,Near,Character,DirectionVertical"</Web:ChartControl></td></tr><tr><td style="width: 100px"><asp:GridView ID="gvLine" runat="server"></asp:GridView></td><td style="width: 100px"><Web:ChartControl ID="ccLine" runat="server" BorderStyle="Outset" BorderWidth="5px"Height="400px" Padding="20" Width="500px"><YAxisFont StringFormat="Far,Near,Character,LineLimit" /> <XTitle StringFormat="Center,Near,Character,LineLimit" Text="Month" /><ChartTitle StringFormat="Center,Near,Character,LineLimit" Text="My Lines" /><XAxisFont StringFormat="Center,Near,Character,LineLimit" /><Background Color="LightSteelBlue" /><YTitleStringFormat="Center,Near,Character,DirectionVertical"Text="Value" /></Web:ChartControl></td></tr></table></div></form></body></html>******************** 代码***************************************************using System;using System.Data;using System.Configuration;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;using System.Drawing;using WebChart;public partial class _Default : System.Web.UI.Page{//我们可以利用此控件创建下列样式的图表//1. Line Charts//2. Smooth Line Charts//3. Column Charts//4. Area Charts//5. Scattered Charts//6. Stacked Column Charts//7. Pie Charts//8. Stacked Area Chartsprotected void Page_Load(object sender, EventArgs e){try{showPieData();showPie();showColumnData();showColumn();showLineData();showLines();}catch (Exception ex){Response.Clear();Response.Write(ex.Message);}}//一个数据protected DataSet getSingleData(){DataSet ds = new DataSet();Random rd = new Random(1);try{DataTable dt = new DataTable();dt.Columns.Add("Month", typeof(string));dt.Columns.Add("value", typeof(string));for (int i = 1; i < 13; i++){DataRow row = dt.NewRow();row[0] = i.T oString();row[1] = Convert.T oInt32(rd.NextDouble() * 100); dt.Rows.Add(row);}ds.Tables.Add(dt);}catch (Exception exD){Response.Write(exD.Message);}finally{ds.Dispose();}return ds;}//多个数据protected DataSet getMultiData(){DataSet ds = new DataSet();Random rd = new Random(1);try{DataTable dt = new DataTable();dt.Columns.Add("Month", typeof(string));dt.Columns.Add("value1", typeof(string));dt.Columns.Add("value2", typeof(string));dt.Columns.Add("value3", typeof(string));dt.Columns.Add("value4", typeof(string));for (int i = 1; i < 13; i++){DataRow row = dt.NewRow();row[0] = i.T oString();row[1] = Convert.T oInt32(rd.NextDouble() * 100); row[2] = Convert.T oInt32(rd.NextDouble() * 100);row[3] = Convert.T oInt32(rd.NextDouble() * 100);row[4] = Convert.T oInt32(rd.NextDouble() * 100);dt.Rows.Add(row);}ds.Tables.Add(dt);}catch (Exception exD){Response.Write(exD.Message);}finally{ds.Dispose();}return ds;}//显示gvPieprotected void showPieData(){gvPie.DataSource = getSingleData().Tables[0].DefaultView;gvPie.DataBind();}//显示gvColumnprotected void showColumnData(){gvColumn.DataSource = getSingleData().Tables[0].DefaultView;gvColumn.DataBind();}//显示gvLineprotected void showLineData(){gvLine.DataSource = getMultiData().T ables[0].DefaultView;gvLine.DataBind();}//填充饼状图表protected void showPie(){try{PieChart chart = new PieChart();chart.DataSource = this.getSingleData().Tables[0].DefaultView;chart.DataXValueField = "Month";chart.DataYValueField = "value";chart.DataLabels.Visible = true;chart.DataLabels.ForeColor = System.Drawing.Color.Blue;chart.Shadow.Visible = true;chart.DataBind();ccPie.Charts.Add(chart);ccPie.RedrawChart();}catch (Exception exPie){throw new Exception(exPie.Message);}}//填充柱状图表protected void showColumn(){try{ColumnChart chart = new ColumnChart();chart.DataSource = this.getSingleData().Tables[0].DefaultView;chart.DataXValueField = "Month";chart.DataYValueField = "value";chart.Legend = "Data Value";chart.MaxColumnWidth = 15;chart.DataLabels.Visible = true;chart.DataLabels.ForeColor = Color.Blue;chart.Shadow.Visible = true;chart.Fill.Color = Color.FromArgb(100, Color.Purple);chart.DataBind();ccColumn.Charts.Add(chart);ccColumn.RedrawChart();}catch (Exception exPie){throw new Exception(exPie.Message);}}//填充线状图表protected void showLines(){try{DataSet ds = getMultiData();LineChart lc1 = new LineChart();lc1.Line.Color = Color.Green;lc1.Fill.Color = Color.Green;lc1.LineMarker = new DiamondLineMarker(5, Color.Green, Color.Black);lc1.Legend = "Value 1";LineChart lc2 = new LineChart();lc2.Line.Color = Color.Blue;lc2.Fill.Color = Color.Blue;lc2.LineMarker = new CircleLineMarker(5, Color.Blue, Color.Green);lc2.Legend = "Value 2";LineChart lc3 = new LineChart();lc3.Line.Color = Color.Red;lc3.Fill.Color = Color.Red;lc3.LineMarker = new DiamondLineMarker(5, Color.Red, Color.Black);lc3.Legend = "Value 3";LineChart lc4 = new LineChart();lc4.Line.Color = Color.Purple;lc4.Fill.Color = Color.Purple;lc4.LineMarker = new DiamondLineMarker(8, Color.Purple, Color.Yellow);lc4.Legend = "Value 4";foreach (DataRow row in ds.Tables[0].Rows){lc1.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[1].T oString())));lc2.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[2].T oString())));lc3.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[3].T oString())));lc4.Data.Add(new ChartPoint(row[0].T oString(), float.Parse(row[4].T oString())));}ccLine.Charts.Add(lc1);ccLine.Charts.Add(lc2);ccLine.Charts.Add(lc3);ccLine.Charts.Add(lc4);ccLine.RedrawChart();}catch (Exception exPie){Response.Write(exPie.Message);}}}。

WinformDevexpressChart使用入门

WinformDevexpressChart使⽤⼊门⼀、Chart(Winform)使⽤图表控件(chart)⾸先要理解图表区域(ChartArea)、XY轴(AxisX、AxisY)、数据点(Series)、标题(Title)、图例(Legend)这⼏个之间的层次关系。

图1：柱形图从图1可以中内容，可以对Chart控件的组成有了⼀个简单的了解。

1.图表区域(ChartArea)从图1中可以看出数据点、XY轴都是属于ChartArea的，这⾥是主要数据展⽰的区域。

2.XY轴(AxisX、AxisY)XY轴的作⽤不⽤多说，具体的设置可以参考Demo中的代码。

3.数据点(Series)圆饼图、散点图、柱形图等等都是由Series的属性设置的。

4.标题(Title)、图例(Legend)这个作⽤不多说了，主要是进⾏⼀些相关属性的设置。

上点代码：1///<summary>2///饼图3///</summary>4private void ChartPie()5 {6//ChartArea7 ChartArea chartArea = new ChartArea()8 {9 Name = "PieArea",10 BorderWidth = 0,11 BorderDashStyle = ChartDashStyle.NotSet,12 };13 chartBar.ChartAreas.Clear();14 chartBar.ChartAreas.Add(chartArea);15//Series16 Series seriesBookA = new Series()17 {18 ChartArea = "PieArea",19 Name = "书籍A销量",20 Color = Color.Red,21 Legend = "LegendBook",22 Tag = "BookASaleCount",23 ChartType = SeriesChartType.Pie,24 XAxisType = AxisType.Primary,25 XValueType = ChartValueType.DateTime,26 IsValueShownAsLabel = true,27 Label = "#VALY(#PERCENT{P0})",28 };29 chartBar.Series.Clear();30 chartBar.Series.Add(seriesBookA);31//Point32double[] value = { 580 };33 DataPoint dataPoint = new DataPoint()34 {35 Name = "书籍A销售量",36 Color = Color.Red,37 YValues = value,38 LegendText = "书籍A销售量:" + value[0],39 };40if (chartBar.Series.Count > 0)41 {42 chartBar.Series[0].Points.Clear();43 chartBar.Series[0].Points.Add(dataPoint);44 value = new double[] { 700 };45 chartBar.Series[0].Points.Add(new DataPoint()46 {47 Name = "书籍B销售量",48 Color = Color.Blue,49 YValues = value,50 LegendText = "书籍B销售量:" + value[0],51 });52 value = new double[] { 300 };53 chartBar.Series[0].Points.Add(new DataPoint()54 {55 Name = "书籍C销售量",56 Color = Color.Pink,57 YValues = value,58 LegendText = "书籍C销售量:" + value[0],59 });60 }61//Title62 Title mainTitle = new Title()63 {64 Name = "MainTitle",65 Text = "书籍销量",66 Font = new Font("微软雅⿊", 12, FontStyle.Regular, GraphicsUnit.Pixel),67 ForeColor = Color.Blue,68 Docking = Docking.Top,69 IsDockedInsideChartArea = true,70 };71 chartBar.Titles.Clear();72 chartBar.Titles.Add(mainTitle);73//Legend74 Legend legend = new Legend()75 {76 Name = "LegendBook",77 LegendStyle = LegendStyle.Table,78 Docking = Docking.Bottom,79 };80 chartBar.Legends.Clear();81 chartBar.Legends.Add(legend);82 }⼆、ChartControl(Devexpress)Dev的ChartControl⽤法和 Winform的类似，但是更为灵活三、问题及解决⽅法1.ChartControl(dev)饼图label重叠问题以下属性设置可解决此问题pieSeriesLabel1.Position = DevExpress.XtraCharts.PieSeriesLabelPosition.TwoColumns; pieSeriesLabel1.ResolveOverlappingMode = DevExpress.XtraCharts.ResolveOverlappingMode.Default;。

dev控件显示柱状图的简单例子

一、绑定实体到图表Step1Step2数据源显示数据二、后台查询数据绑定到bingdingsourepublic void Init(){//通过查询数据库取得值DataTable dt = updateEmp.queryEMp();this.bindingSource1.DataSource = dt;chartControl2.Series.Clear();Series Series1 = new Series("工资", ViewType.Bar);Series1.ArgumentScaleType = ScaleType.Qualitative;Series1.ArgumentDataMember = "姓名";Series1.ValueScaleType = ScaleType.Numerical;Series1.ValueDataMembersSerializable = "工资";Series1.View.Color = Color.Red;chartControl2.Series.Add(Series1);belsVisibility =DevExpress.Utils.DefaultBoolean.True;}Step1Step2Step3三、无数据绑定的图表后台查询数据显示public void Init(){chartControl2.Series.Clear();Series series1 = new Series("工资", ViewType.Bar);Series series2 = new Series("奖金", ViewType.Bar);chartControl2.Series.Add(series1);chartControl2.Series.Add(series2);//获取曲线图所要显示的数据UpdateIronInfo updateIronInfo = new UpdateIronInfo();DataTable dt = updateEmp.queryEMp();SeriesPoint point = null;foreach (DataRow row in dt.Rows){if (row["姓名"].ToString() != null){point = new SeriesPoint(row["姓名"].ToString());double[] vals ={ Convert.ToDouble(row["工资"].ToString()) };point.Values = vals;series1.Points.Add(point);}if (row["奖金"].ToString()!=null){point = new SeriesPoint(row["姓名"].ToString());double[] vals ={ Convert.ToDouble(row["奖金"].ToString()) };point.Values = vals;series2.Points.Add(point);}}BarSeriesView sv1 = (BarSeriesView)series1.View;BarSeriesView sv2 = (BarSeriesView)series2.View;sv1.BarWidth = 0.5;sv2.BarWidth = 0.5;sv1.Color = Color.Red;sv2.Color = Color.Blue;}。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。