用Chart控件绘制动态图表
- 格式:doc
- 大小:53.00 KB
- 文档页数:8
使用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。
JSP动态图表JFreeChart是一个Java开源项目,是一款优秀的Java图表生成插件,它提供了在Java Application、Servlet和JSP下生成各种图片格式的图表,包括柱形图、饼形图、线图、区域图、时序图和多轴图等。
1 JFreeChart的下载与使用在JFreeChart的官方网站(/jfreechart/index.html)上可以下载到该插件,该插件有两个版本:●jfreechart-1.0.13.zip,该版本适用于Windows系统;●jfreechart-1.0.13.tar.gz,该版本适用于UNIX/Linux系统。
解压缩jfreechart-1.0.13.zip后将得到一个名为jfreechart-1.0.13的文件夹,只需将lib子文件夹内的jfreechart-1.0.13.jar和jcommon-1.0.16.jar两个文件拷贝到Web 应用程序的WEB-INF下的lib文件夹内,并且在该Web应用程序的web.xml文件2 JFreeChart的核心类在使用JFreeChart组件之前,首先应该了解该组件的核心类及其功能。
JFreeChart核心类如表8-1所示。
表8-1 JFreeChart核心类表中给出的各对象的关系如下:JFreeChart中的图表对象用JFreeChart对象表示,图表对象由Title(标题或子标题)、Plot(图表的绘制结构)、BackGround(图表背景)、toolstip(图表提示条)等几个主要的对象组成。
其中Plot对象又包括了Render(图表的绘制单元——绘图域)、Dataset(图表数据源)、domainAxis(x轴)、rangeAxis(y轴)等一系列对象组成,而Axis(轴)是由更细小的刻度、标签、间距、刻度单位等一系列对象组成。
3 利用JFreeChart生成动态图表通过JFreeChart插件可以生成多种动态图表,包括柱形图、饼形图、折线图、区域图、时序图、多轴图和组合图等七种图表。
一.数据源说到绘制图表,可能很多人的第一反应除了是图表呈现的方式外,更关心的便是数据如何添加,记得在很多年前,哪时要绘制一个数据曲线图,一直找不到好的呈现方式,后来使用了SVG的绘图模式,不过在添加数据的时候可谓吃尽了苦头,毕竟,SVG只是一种描述语言,要动态的实现一个图表的绘制,是非常困难的.对于微软的图表控件,数据添加是一件很简单的方式,它支持多种数据添加方式,如:·可以在图表的设计界面,在属性设置窗口中的Series属性下的Points中添加需要的数据.·可以在图表的设计界面中,在属性中绑定一个数据源.·可以在后台代码中,动态添加数据.·可以在后台代码中设置一个或多个数据源,直接绑定到图表中.在此处,我只着重讲解一下第3,4两点.对于第3点,相对来说比较简单,在后台代码中,找到要添加代码的Series,通过它下面Points的Add、AddXY、AddY等方法,即可以实现数据的添加.例如:1. double t;2. for(t = 0; t <= (2.5 * Math.PI); t += Math.PI/6)3. {4. double ch1 = Math.Sin(t);5. double ch2 = Math.Sin(t-Math.PI/2);6. Chart1.Series["Channel 1"].Points.AddXY(t, ch1);7. Chart1.Series["Channel 2"].Points.AddXY(t, ch2);8. }复制代码注:代码摘自微软的例子,上例中,Chart1为图表的名字,Channel 1、Channel 2分别表示两个Series数据序列)二.绑定数据先来看看图表控件都支持什么类型的数据绑定,根据官方文档的说法,只要是实现了IEnumerable接口的数据类型,都可以绑定到图表控件中,例如:DataView, DataReader, DataSet, DataRow, DataColumn, Array, List, SqlCommand, OleDbCommand, SqlDataAdapter, 及OleDbDataAdapter对象。
利用MsChart控件动态生成通用在线图表摘要:为了将已有的数据在线生成所需的图表,提出了利用微软的MsChart控件设计通用在线图表的方法。
首先对为什么及如何灵活获取数据源进行了分析,并提出了在线录入和动态调用Web 服务两种方法。
有了数据源的格式和数据,就可以使用MsChart 控件实现在线绑定、在线生成图表、在线设置图表风格和在线发布。
通过软件系统的开发和实例运行,验证了通用在线图表的生成。
关键词:MsChart;数据源;动态;在线图表为了使在线图形报表系统相对通用,必须满足以下条件:①系统能适应数据源的变化来生成在线图表,不用为每个数据源编写相应代码;②系统能适应图表类型变化,同一数据源可以生成不同的图表;③系统能适应相应图表类型的风格变化。
因此,要求系统对数据源的获取必须具有动态性,即系统不捆绑特定的数据源来生成图形报表,任何人可以利用该系统将自己手头的数据生成图形报表;要求系统对图形报表的生成必须具有动态性,即报表的类型和风格可以由用户自己设定。
总之,在线图表系统在不知道数据的来源、类型和结构的情况下,只要用户向该系统提供报表数据,就能生成用户所需的图形报表,并且能实时在线反映,供用户调整,还能在线发布,供用户下次通过输入网址直接浏览。
具体的设计思路如图1所示,其中的MsChart 指的是微软提供的免费图表控件,结合了.NET 3.5框架,用它可以很方便地建立各种图表,同时支持Web和WinForm两种方式。
2动态获取数据源2.1用户在界面上手动输入数据系统提供输入界面,供用户手动输入报表数据。
输入的数据须有一定的结构和类型,并且方便浏览和修改,才能更好地为用户生成所需的图表服务,设计流程如图2所示,相应的运行界面如图3和图4所示。
实现要点:①回发的数据如何保存和方便使用,先要生成图表数据结构内存数据集m_dtStructure,其次生成图表数据内存数据集m_dtData,两个数据集还要方便浏览和维护,最终还要根据m_dtData生成在线图表,不断变化、回发和再次使用的数据可以存放在Session对象中,如果所有的界面在一个页面,也可以放在视图状态ViewState对象中;②如何产生上面两个内存表的结构,m_dtStructure的结构是固定的,包括字段名和字段类型,m_dtData的结构由m_dtStructure中的内容决定;③数据输入界面是根据m_dtStructure动态生成的,并且还要进行输入数据的类型验证;④使用数据展示控件完成m_dtStructure和m_dtData的浏览和维护,每当数据集发生变化的时候,都要用新的数据集进行重新绑定。
图表插件Highcharts的动态化赋值,实现图表数据的动态化设置显⽰在很早之前就介绍过图表插件Highcharts的使⽤了,在2014年的随笔《》,这⾥基本上都介绍的⽐较完整,基本的设置也没有太⼤的差异,本篇介绍的是基于Bootstrap开发框架的界⾯处理,以及对图表插件Highcharts的其他模块,如柱状图,线图等其他样式的信息进⾏动态设置,以期达到利⽤数据库的数据,⽅便动态设置显⽰出来。
1、Bootstrap框架图标的展⽰饼图的数据展⽰界⾯效果如下所⽰柱状图以及其他曲线图展⽰效果如下所⽰。
使⽤这些图表功能强,我们⼀般需要在页⾯⾥⾯引⼊对应的JS+CSS2、使⽤脚本动态设置图表的数据默认的案例,这些数据都是直接绑定在⾥⾯的,有时候我们需要动态设置,那么需要分析好对应的数据属性,以及设置的API,才能正常进⾏显⽰。
以饼图为例,我们需要分析它的数据结构,⼀般是Series⾥⾯的Data数据格式,不同的图表样式需要的数据结构不太⼀样,对于图表⽽已,它的数据格式如下所⽰。
另外也可以使⽤key、Value⽅式的定义格式,如下数据所⽰。
那么,有了这些了解,我们就可以通过Ajax⽅式,动态从数据库⾥⾯获取数据,并绑定在界⾯上显⽰即可。
⾸先我们定义好界⾯上的⼀个图表展⽰控件DIV层,如下代码所⽰。
<div class="tab-char" id="container1" style="height: 300px;max-width:500px"></div>然后通过JS动态创建对应的图表对象,并设置图表的数据即可。
var chart1 = new Highcharts.Chart({chart: {renderTo: "container1",plotBackgroundColor: null,plotBorderWidth: null,plotShadow: false,},title: {text: '集团分⼦公司⼈员组成'},tooltip: {pointFormat: '{}: <b>{point.y}</b>'},plotOptions: {pie: {allowPointSelect: true,cursor: 'pointer',dataLabels: {enabled: true,format: '<b>{}</b>: {point.percentage:.1f} %',style: {color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'}},//showInLegend: trueseries: [{type: 'pie',name: '⼈员数量',data: []}]});动态构建数据是通过Ajax⽅式实现的,如下所⽰。
VBA中的动态图表和数据可视化技巧数据可视化是一种将大量数据转化为易于理解的图表和图形的方法。
在商业和科学领域中,数据可视化可以帮助我们更好地理解和分析复杂的数据集。
VBA(Visual Basic for Applications)是用于自动化和定制Microsoft Office应用程序的编程语言。
在这篇文章中,我们将探讨如何使用VBA实现动态图表和数据可视化的技巧。
一、图表基础在开始动态图表和数据可视化之前,我们首先需要了解一些图表基础知识。
VBA中常用的图表类型包括柱形图、折线图、饼图等。
通过选择合适的图表类型,我们可以更好地展示和比较数据。
1.1 创建图表在VBA中创建图表可以使用ChartObjects对象和ChartObject对象来实现。
首先,我们需要在所需的工作表上创建一个ChartObject对象,然后可以使用ChartObject对象的Chart属性来操纵该图表。
下面是一个创建柱形图的示例代码:```vbaDim ws As WorksheetDim co As ChartObjectDim cht As ChartSet ws = ThisWorkbook.Worksheets("Sheet1")Set co = ws.ChartObjects.Add(Left:=100, Top:=100, Width:=400, Height:=300)Set cht = co.ChartWith cht.ChartType = xlColumnClustered.SetSourceData ws.Range("A1:B10")End With```1.2 修改图表样式我们可以通过修改图表的属性来改变其样式和外观。
例如,可以设置图表的标题、改变图表的颜色和字体,以及添加数据标签等。
下面是一个修改图表样式的示例代码:```vbaWith cht.HasTitle = True.ChartTitle.Text = "Sales Report".ChartTitle.Font.Size = 14.ChartTitle.Font.Bold = True.ApplyLayout (3).SeriesCollection(1).DataLabels.Position = xlLabelPositionOutsideEnd.SeriesCollection(1).DataLabels.ShowValue = TrueEnd With```二、动态图表动态图表是指随着数据的实时变化而更新的图表。
一、介绍qchart动态绘制曲线的意义和作用qchart是一种用于动态绘制曲线的工具,它可以在Python语言下进行编程,实现实时数据的动态展示。
在数据可视化和实时监测等领域具有重要的应用价值。
二、qchart动态绘制曲线的基本功能和特点1. qchart可以根据实时数据动态绘制曲线,能够实时展现数据的变化趋势和波动情况。
2. qchart具有丰富的绘图功能,可以实现曲线的定制化展示,包括曲线样式、颜色、标签等的设置。
3. qchart支持多种数据格式的输入,能够方便地与各种数据源进行对接,并实现动态图表展示。
三、使用Python语言编写qchart动态绘制曲线的基本流程1. 导入qchart库,并进行初始化设置。
2. 设置曲线的基本属性,包括颜色、线型、标签等。
3. 实时监听数据源,获取实时数据。
4. 调用qchart的绘图函数,实现曲线的动态绘制。
四、实际案例分析:使用qchart实现网络带宽实时监测1. 问题背景:某公司需要对网络带宽进行实时监测,以及对网络负载情况进行分析和优化。
2. 解决方案:利用Python语言编写qchart动态绘制曲线的程序,实现网络带宽的实时监测和动态展示。
3. 案例步骤:(1) 导入qchart库,并进行初始化设置。
(2) 设置带宽曲线的样式、颜色和标签。
(3) 实时监听网络带宽数据源,获取实时带宽数据。
(4) 调用qchart的绘图函数,实现带宽曲线的动态绘制。
4. 案例结果:通过qchart动态绘制曲线,实现了网络带宽的实时监测和动态展示,为公司提供了数据支持和决策参考。
五、qchart动态绘制曲线的优缺点分析1. 优点:qchart能够快速实现曲线的动态绘制,具有良好的实时性和响应速度;支持大规模数据的展示,适用于不同场景的需求。
2. 缺点:在使用过程中可能会遇到一些性能和稳定性方面的挑战,需要进一步优化和改进。
六、总结和展望1. 总结:qchart动态绘制曲线在Python语言下具有重要的应用意义,能够满足实时数据展示的需求。
Qt绘制动态曲线⾸先*.pro⽂件中加⼀句QT += charts然后mainwindow.cpp⽂件如下:#include "mainwindow.h"#include "ui_mainwindow.h"#include "QtCharts/QChart"#include "QLineSeries"#include "QValueAxis"#include "QTimer"#include "QTime"#include "QList"#include "qmath.h"#include "QPointF"#include "QDebug"//#include <QtCharts/QChartGlobal>#include "QChartView"QT_CHARTS_USE_NAMESPACEQChart *m_chart;QLineSeries *m_series;//QList<double> dataList;//存储业务数据int maxSize = 5000;int tem=0,flag=0;//QTimer updateTimer;int timeId;MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),//默认初始化?ui(new Ui::MainWindow){ui->setupUi(this);m_chart = new QChart;//图表类QChartView *chartView = new QChartView(m_chart);//图表视窗类// v.setRubberBand(QChartView::HorizontalRubberBand);chartView->setRubberBand(QChartView::RectangleRubberBand);//在图表窗⼝设置矩形橡⽪筋// chartView->setRubberBand();m_series = new QLineSeries;//线连续类m_chart->addSeries(m_series);//在图表类添加连续线for(int i=0;i<maxSize;++i){m_series->append(i,0);//在线连续类附加坐标x&y}m_series->setUseOpenGL(true);//openGl 加速qDebug()<<m_series->useOpenGL();QValueAxis *axisX = new QValueAxis;//数值轴类axisX->setRange(0,maxSize);//设置X坐标的范围axisX->setLabelFormat("%g");//设置标签格式axisX->setTitleText("axisX");//设置X坐标的标题名称QValueAxis *axisY = new QValueAxis;axisY->setRange(0,2000);//设置Y坐标的范围可以设置负数axisY->setTitleText("axisY");//设置Y坐标的标题名称m_chart->setAxisX(axisX,m_series);//将轴添加在图表中m_chart->setAxisY(axisY,m_series);//m_chart->legend()->hide();//图列隐藏有⼀个蓝⾊的⼩点被隐藏了。
C++第四⼗四篇--MFC使⽤ChartCtrl绘制动态曲线前⾔⽬的:使⽤控制台程序带MFC类库画⼀个动态曲线图参考链接:操作步骤1. 创建⼀个勾选MFC类库的控制台程序上⼀章讲过,此处不做赘述。
2. 新建⼀个窗⼝程序3. 编写动态折线图chart.cpp// chart.cpp : implementation file//#include "pch.h"#include "stdafx.h"#include "CPUUsage.h"#include "chart.h"#include "afxdialogex.h"// chart dialogIMPLEMENT_DYNAMIC(chart, CDialog)chart::chart(CWnd* pParent /*=nullptr*/): CDialog(IDD_chart, pParent){}chart::~chart(){}void chart::DoDataExchange(CDataExchange* pDX){CDialog::DoDataExchange(pDX);DDX_Control(pDX, IDC_CUSTOM_CHART, m_ChartCtrl); }BEGIN_MESSAGE_MAP(chart, CDialog)ON_WM_SIZE()ON_WM_TIMER()ON_WM_PAINT()END_MESSAGE_MAP()#define DATA_SHOW_LENGHT 2000 //总共显⽰的点个数#define DATA_UPDATE_LENGHT 10 //每次更新的点个数#define DATA_SHOW_X_AXIS 2000 //X轴显⽰的点最⼤值#define DATA_SHOW_Y_AXIS 1000 //Y轴显⽰的点最⼤值//要显⽰点的缓冲数据static double xBuff[DATA_SHOW_LENGHT] = { 0 };static double yBuff[DATA_SHOW_LENGHT] = { 0 };//显⽰点数据包初始化void chart::DataBuffInit(void){for (int i = 0; i < DATA_SHOW_LENGHT; i++) {xBuff[i] = i;yBuff[i] = 50;// cos((i)) * 10 + 50;}}//初始化画图界⾯窗⼝void chart::ChartCtrlInit(void) {//⼿动创建显⽰窗⼝//CRect rect, rectChart;//GetDlgItem(IDC_CUSTOM_SHOW)->GetWindowRect(&rect);//ScreenToClient(rect);//rectChart = rect;//rectChart.top = rect.bottom + 3;//rectChart.bottom = rectChart.top + rect.Height();//m_ChartCtrl2.Create(this, rectChart, IDC_CUSTOM_SHOW2);//m_ChartCtrl2.ShowWindow(SW_SHOWNORMAL);///////////////////////显⽰主题/////////////////////////////m_ChartCtrl.GetTitle()->AddString(_T("CPU Usage"));///////////////////////创建坐标xy标识///////////////////////////////m_ChartCtrl.GetBottomAxis()->GetLabel()->SetText(_T("强度"));//m_ChartCtrl.GetLeftAxis()->GetLabel()->SetText(_T("采样点"));///////////////////////创建坐标显⽰范围/////////////////////////////CChartAxis *pAxis = NULL;pAxis = m_ChartCtrl.CreateStandardAxis(CChartCtrl::BottomAxis);pAxis->SetMinMax(0, DATA_SHOW_X_AXIS);pAxis = m_ChartCtrl.CreateStandardAxis(CChartCtrl::LeftAxis);pAxis->SetMinMax(0, DATA_SHOW_Y_AXIS);}// CmyApplicationDlg 消息处理程序BOOL chart::OnInitDialog(){CDialog::OnInitDialog();//获取显⽰的对话框⼤⼩CRect rect;GetClientRect(&rect);oldPiont.x = rect.right - rect.left;oldPiont.y = rect.bottom - rect.top;// 设置此对话框的图标。
C# chart控件绘制多图表区图像想要根据数据库中记录个数动态决定chart控件的绘图区域,保证它们大小均匀,在网上找了N久么有发现满意答案,纠结了快一天的时间,终于把问题解决了,贴出来供大家分享O(∩_∩)O~前面的代码中定义一个series对象数组:List<Series> listSer = new List<Series>();引发动态生成图表的按钮事件完整如下:private void button1_Click(object sender, EventArgs e){OCon Mycon = new OCon();OracleConnection conn = Mycon.getCon();conn.Open();string sqlString = "select count(*) from dotrelation where dotdesc like '2%路基%温度%'";num = Mycon.countORL(conn, sqlString);//获得数据库中满足条件的记录数//MessageBox.Show("满足条件的数据记录为" + num);int heightPer = 100 / num;//计算每个绘图区高度for (int i = 0; i < num; i++){string serName = "test" + i.ToString();listSer.Add(new Series(serName));//对象数组fillData(date);//初始化数组此方法自己定义的initialSeries((Series)listSer[i], Color.Red, date);chart1.ChartAreas.Add("ANOTHER" + i);//这里是关键!!!!!chart1.ChartAreas[i].Position.Width = 100;//绘图区域在控件中的宽度 100是百分比chart1.ChartAreas[i].Position.Height = heightPer;chart1.ChartAreas[i].Position.X = 5;//绘图区域在控件中的绝对位置横坐标chart1.ChartAreas[i].Position.Y = 3 + heightPer * i;//绘图区域在控件中的绝对位置纵坐标chart1.ChartAreas[i].AxisX.LineColor = Color.Blue;chart1.ChartAreas[i].AxisY.LineColor = Color.Blue;chart1.ChartAreas[i].AxisX.LineWidth = 2;chart1.ChartAreas[i].AxisY.LineWidth = 2;chart1.ChartAreas[i].AxisY.Title = "监测值";//设置网格线chart1.ChartAreas[i].AxisX.MajorGrid.LineColor = Color.Blue; chart1.ChartAreas[i].AxisX.MajorGrid.Interval = 2;//网格间隔chart1.ChartAreas[i].AxisX.MinorGrid.Interval = 2;chart1.ChartAreas[i].AxisY.MajorGrid.LineColor = Color.Blue;chart1.ChartAreas[i].AxisY.MajorGrid.Interval = 2;chart1.ChartAreas[i].AxisY.MinorGrid.Interval = 2;chart1.Series[i].IsValueShownAsLabel = false; //是否显示数据chart1.Series[i].IsVisibleInLegend = false; //是否显示数据说明chart1.Series[i].MarkerStyle = MarkerStyle.Circle; //线条上的数据点标志类型chart1.Series[i].MarkerSize = 3; //标志大小chart1.Series[i].ChartType = SeriesChartType.Line; //图表类型为曲线string name = "ANOTHER" + i.ToString();chart1.Series[i].ChartArea = name;//指定绘图区域chart1.ChartAreas[i].AxisX.LineColor = Color.Blue; //X轴颜色chart1.ChartAreas[i].AxisY.LineColor = Color.Blue; //Y轴颜色chart1.ChartAreas[i].AxisX.LineWidth = 2; //X轴宽度chart1.ChartAreas[i].AxisY.LineWidth = 2; //Y轴宽度chart1.ChartAreas[i].AxisY.Title = "人数"; //Y轴标题}//fillData(date);//初始化数组//initialSeries(series1, Color.Red, date);initalChart();//图表初始化 }C#中CHART控件简单示例:<asp:Chart ID="Chart1"runat="server"Height="400px"Width="500px"> <Series><asp:Series Name="Series1"ChartType="Column" ChartArea="ChartArea1"></asp:Series><asp:Series Name="Series2"ChartType="Column" ChartArea="ChartArea1"></asp:Series></Series><ChartAreas><asp:ChartArea Name="ChartArea1"></asp:ChartArea></ChartAreas></asp:Chart>后台代码:protected void Page_Load(object sender, EventArgs e){DataTable dt = default(DataTable);dt = CreateDataTable();//设置图表的数据源Chart1.DataSource = dt;//设置图表Y轴对应项Chart1.Series[0].YValueMembers = "Volume1";Chart1.Series[1].YValueMembers = "Volume2";//设置图表X轴对应项Chart1.Series[0].XValueMember = "Date";//绑定数据Chart1.DataBind();}private DataTable CreateDataTable(){//Create a DataTable as the data source of the Chart control DataTable dt = new DataTable();//Add three columns to the DataTabledt.Columns.Add("Date");dt.Columns.Add("Volume1");dt.Columns.Add("Volume2");DataRow dr;//Add rows to the table which contains some random data for demonstrationdr = dt.NewRow();dr["Date"] = "Jan";dr["Volume1"] = 3731;dr["Volume2"] = 4101;dt.Rows.Add(dr);dr = dt.NewRow();dr["Date"] = "Feb";dr["Volume1"] = 6024;dr["Volume2"] = 4324;dt.Rows.Add(dr);dr = dt.NewRow();dr["Date"] = "Mar";dr["Volume1"] = 4935;dr["Volume2"] = 2935;dt.Rows.Add(dr);dr = dt.NewRow();dr["Date"] = "Apr";dr["Volume1"] = 4466;dr["Volume2"] = 5644; dt.Rows.Add(dr);dr = dt.NewRow();dr["Date"] = "May"; dr["Volume1"] = 5117; dr["Volume2"] = 5671; dt.Rows.Add(dr);dr = dt.NewRow();dr["Date"] = "Jun"; dr["Volume1"] = 3546; dr["Volume2"] = 4646; dt.Rows.Add(dr);return dt;}浏览页面:private void showChart(Chart chart, double[] value){string[] xValue = { "A", "B", "C", "D" }; //设Θ?置?标括?签?double[] yValue = value; //获?取?要癮显?示?的?值μchart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss; //设Θ?置?图?表括?边?框ò为a浮?雕?效§果?chart.BorderlineDashStyle = ChartDashStyle.Solid; //设Θ?置?图?表括?边?框ò为a实害?线?chart.BorderlineWidth = 1; //设Θ?置?图?表括?边?框ò的?宽í度èchart.Series[0].ChartType = SeriesChartType.Pie; //设Θ?置?图?表括?类え?型í为a饼纘图?chart.Series[0].CustomProperties = "DoughnutRadius=25, PieDrawingStyle=Concave, CollectedLabel=Other, MinimumRelative" + "PieSize=20"; //设Θ?置?饼纘图?的?参?数簓chart.Series[0].Points.DataBindXY(xValue, yValue); //将?数簓据Y绑悒?定¨到?图?表括?}double[] value = { 30, 40, 50, 60 }; //要癮显?示?的?数簓据YshowChart(this.chart1, value); //显?示?图?表括?。
微软图表控件MsChart使用指南昨天在网上看到了微软发布了.NET 3.5框架下的图表控件,第一时间抓下来看了一下,发觉功能很强劲,基本上能想到的图表都可以使用它绘制出来,给图形统计和报表图形显示提供了很好的解决办法,同时支持Web和WinForm两种方式,不过缺点也比较明显,只能在最新的开发环境中使用,需要.Net 3.5 Sp1以及VS 2008的开发环境。
下面是下载地址:mework 3.5)–1.包含英文版,中文版。
上面提供的链接是中文版的,可以更改为英文版。
2.语言包:Microsoft Chart Controls for Microsoft .NETFramework 3.5 Language Pack3.Microsoft .NET Framework 3.5 的Microsoft 图表控件的语言包,包含23中语言。
4.Microsoft Chart Controls Add-on for Microsoft Visual Studio 2008–这个只有英文的,没找到中文的。
5.文档(Microsoft Chart Controls for .NET Framework Documentation)–这个只有英文的,没找到中文的。
6.WinForm 和的例子(Samples Environmentfor Microsoft Chart Controls)–这个只有英文的,没找到英文的。
7.Demo 下载:/mschart下了它的示例程序后,运行了一下,非常的强大,可以支持各种各样的图形显示,常见的:点状图、饼图、柱状图、曲线图、面积图、排列图等等,同时也支持3D样式的图表显示,不过我觉得最有用的功能还是支持图形上各个点的属性操作,它可以定义图形上各个点、标签、图形的提示信息(Tooltip)以及超级链接、Jav ascript动作等,而不是像其它图形类库仅生成一幅图片而已,通过这些,加上微软自己的Ajax框架,可以建立一个可以互动的图形统计报表了。
利用JFreeChart生成饼状图
在利用JFreeChart生成了的动态图表中,除了生成柱状图的图片格式外,还可以生成饼状图的图片格式。
本扩展练习的目的是:在提供了一组数据情况下,利用JFreeChart生成饼状图。
(1)新建一个命名为jPie3D.jsp文件。
【新建】|【JSP (advanced Templates)】命令,弹出【新建JSP页面】对话框,在对话框的文件名称中输入jPie3D.jsp,单击【完成】按钮。
(3)在jPie3D.Jsp文件中输入以下内容并保存。
图表的类别和图表的标题。
然后分别构造了一个PieDataset和JFreeChart对象用于得到各个类别的数值和设置图表的标题、显示的数据集等信息,最后设置图表的格式、文件名和图表浏览路径。
执行上述代码,结果如图8-7所示。
图8-7 实心3D饼状图。
livecharts用法LiveCharts是一个开源的跨平台的数据可视化库,它可以在各种应用程序中用于展示动态和静态的数据图表。
以下是关于如何使用LiveCharts的详细介绍。
安装和配置:首先,我们需要通过NuGet包管理器在Visual Studio中安装LiveCharts库。
可以通过"LiveCharts"来找到并安装最新版本。
接下来,在应用程序代码中导入LiveCharts库的命名空间:```csharpusing LiveCharts;using LiveCharts.Wpf;```使用LiveCharts创建图表:首先,我们需要创建一个SeriesCollection对象来存储要显示的数据系列。
SeriesCollection是一个集合,可以包含多个数据系列。
```csharpSeriesCollection seriesCollection = new SeriesCollection(;```然后,我们可以创建一个Chart对象,并将之前创建的SeriesCollection对象设置为其Series属性。
CartesianChart chart = new CartesianChartSeries = seriesCollection};```接下来,我们可以设置图表的其他属性,如标题、坐标轴、图例等。
```csharpchart.Title = "Example Chart";chart.AxisX.Add(new AxisTitle = "X-axis"});chart.AxisY.Add(new AxisTitle = "Y-axis"});chart.LegendLocation = LegendLocation.Right;```添加数据系列到图表中:我们可以使用LineSeries、ColumnSeries、PieSeries等类型的对象来创建不同类型的数据系列。
•前言(Preface)•安装(Installation)•如何设置参数(How to set up the options)•预处理参数(Preprocess the options)•活动图(Live charts)<script src="/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script><script src="/js/highcharts.js" type="text/javascript"></script>Highcharts(Highstock)已经内置了jQuery适配器(adapter)(注:可能是jQuery框架最流行的缘故),但是并没有内置MooTool等其他javascript框架的适配器(adapter)。
因此,当我们使用MooTool等其他JS框架时,需要单独引用适配器(adapter)脚本文件。
如下:<scriptsrc="https:///ajax/libs/mootools/1.3.0/mootools-yui-compr essed.js" type="text/javascript"></script><script src="/js/adapters/mootools-adapter.js" type="text/javascript"></script> <script src="/js/highcharts.js" type="text/javascript"></script>提示:安装Highstock过程与上述相同,除了JavaScript文件名称是highstock.js而不是highcharts.js。
VBA中的图表制作和数据可视化方法在VBA中,图表制作和数据可视化是非常有用的功能。
通过图表,我们可以更直观地理解和分析数据,从而更好地支持决策和沟通工作。
本文将介绍在VBA中如何使用图表制作和数据可视化方法,以及一些实用技巧和注意事项。
一、图表类型选择在VBA中,可以使用ChartObjects对象和ChartObject对象来创建和操作图表。
首先需要选择合适的图表类型来展示数据。
常见的图表类型包括柱形图、折线图、饼图、散点图等。
柱形图:适用于比较各组数据之间的差异。
折线图:适用于显示数据的趋势和变化。
饼图:适用于显示各部分占总体的比例。
散点图:适用于展示两个变量之间的关系。
根据具体需求和数据特点选择合适的图表类型,可以更好地展示数据。
二、数据源设置在VBA中创建图表之前,需要将数据源设置好。
数据源可以是Excel表格、数据库中的表或者数组等。
首先需要将数据源引用到VBA 中,并将其赋值给一个数组变量或者使用Range对象引用。
例如,创建一个柱形图,数据源是A1:B10的数据。
可以使用以下代码将数据导入VBA数组:Dim dataRange As RangeDim dataArray() As VariantSet dataRange = Sheet1.Range("A1:B10")dataArray = dataRange.Value三、创建图表在VBA中,可以使用ChartObjects对象和ChartObject对象来创建和操作图表。
首先,需要创建一个ChartObjects对象,然后使用Add 方法来添加一个图表对象。
接下来,可以使用ChartObject对象的Chart 属性来操作图表,设置图表类型、添加数据系列、设置坐标轴等。
以下是一个简单的创建柱形图的示例代码:Dim chartObjs As ChartObjectsDim chartObj As ChartObjectDim chart As ChartSet chartObjs = Sheet1.ChartObjectsSet chartObj = chartObjs.Add(100, 100, 400, 300)Set chart = chartObj.Chartchart.ChartType = xlColumnClustered四、图表样式设置除了图表类型、数据源设置之外,还可以通过VBA来设置图表的样式,使其更符合需求。
用Chart控件绘制动态图表---- 进行程序设计时,选用一个合适的ActiveX控件,有时可大大减少编程工作量。
ActiveX 控件(又称OCX)基于COM技术,作为独立的软件模块,它可以在任何程序设计语言中插入使用。
本文仅以VC++为例说明Chart控件的使用。
---- Chart控件指Mschart.ocx(5.0版)或Mschrt20.ocx(6.0 版),是Visual Studio自带的ActiveX控件之一,其属性、事件很多,功能非常强大,可实现柱状直方图、曲线走势图、饼状比例图等,甚至可以是混合图表,可以是二维或三维图表,可以带或不带坐标系,可以自由配置各条目的颜色、字体等等。
一安装和使用Chart控件----在用到Chart控件的项目中安装该控件:从Project->Add to Project ->Components And Controls->Registered Active Xcontrols,选择Chart控件,则ClassWizard会生成相应的C++类,其中类CMSChart是由CWnd派生来的,它是Chart 控件的主要类,其他的类全部是由COleDispatchDriver派生来,控制控件中的相应对象,完成各部分相关功能,如CvcAxis类是实现坐标轴相关功能的源代码。
同时在项目的控件工具箱上会出现代表Chart控件的按钮,使用时把Chart控件按钮从工具箱拖到对话框中,调整大小即可。
----Chart控件至少有45个属性、9个方法、49个事件,在这里就不一一列举了。
---- 在设计中,我们可以在主要属性页里修改各属性的属性值:右击对话框窗口中的Chart控件,选择“Properties”菜单项,就会弹出主要属性页对话框,对其中各属性值进行设置。
有些属性在主要属性页里没有列出,只能编程修改。
另外要动态绘制图表,必须掌握对控件的编程控制。
---- 首先在对话框类中定义控件变量,以便编程时操纵控件。
如对话框类定义如下:class CAbcDlg : public CDialog{public:CAbcDlg(CWnd*pParent = NULL);//{{AFX_DA TA(CAbcDlg)enum { IDD = IDD_ABC_DIALOG };CMSChart m_Chart;//}}AFX_DA TA......};----ActiveX控件的属性和方法在控件内部对应唯一一个整数索引值,编程时可以通过索引来设置或获取控件的属性值,也可以通过调用控件的C++类(在这里就是CMSChart)的成员函数设置或获取控件的属性值及调用控件的方法。
例如:----在CMSChart类实现中有如下代码:CString CMSChart::GetData(){CString result;InvokeHelper(0x9, DISPA TCH_PROPERTYGET,VT_BSTR, (void*)&result, NULL);return result;}void CMSChart::SetData(LPCTSTR lpszNewV alue){static BYTE parms[] =VTS_BSTR;InvokeHelper(0x9, DISPA TCH_PROPERTYPUT,VT_EMPTY, NULL, parms,lpszNewV alue);}void CMSChart::Refresh(){InvokeHelper(DISPID_REFRESH,DISPA TCH_METHOD, VT_EMPTY, NULL, NULL);}----这段代码表明:属性“Data”索引值为0x9,我们可以调用函数SetData对图表中某点的值进行设置。
索引值为DISPID_REFRESH的方法“Refresh”,调用它进行刷新。
如:CString str=“34.5";m_Chart.SetData(str);m_Chart.Refresh();......----阅读CMSChart类的实现会发现,有些属性的值不是普通的BOOL、CString等数据类型,而是另一个控件驱动类的类变量,如:CVcPlot CMSChart::GetPlot(){LPDISPA TCH pDispatch;InvokeHelper(0x28, DISPA TCH_PROPERTYGET,VT_DISPA TCH, (void*)&pDispatch, NULL);return CVcPlot(pDispatch);}----在CVcPlot类的实现中有如下代码:CVc Axis CVcPlot::GetAxis(long axisID, const V ARIANT&Index){LPDISPA TCH pDispatch;static BYTE parms[] =VTS_I4 VTS_V ARIANT;InvokeHelper(0x1f, DISPA TCH_PROPERTYGET,VT_DISPA TCH, (void*)&pDispatch, parms, axisID, &Index);return CVcAxis(pDispatch);}----而CVcAxis类的实现中有如下代码:CVc V alueScale CVcAxis::GetV alueScale(){LPDISPA TCH pDispatch;InvokeHelper(0x9, DISPA TCH_PROPERTYGET,VT_DISPA TCH, (void*)&pDispatch, NULL);return CVcV alueScale(pDispatch);}----而CVcV alueScale类的实现中又有如下代码:void CVcV alueScale::SetMaximum(double newV alue){static BYTE parms[] =VTS_R8;InvokeHelper(0x3, DISPA TCH_PROPERTYPUT,VT_EMPTY, NULL, parms,newV alue);}----这正是Chart控件的灵活性所在,根据上述代码,如下的调用:V ARIANT var;m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMaximum(50.0);可实现把纵坐标的最大刻度设为50.0。
----控件触发的事件,如Click、MouseDown等,如果需要处理,可以通过ClassWizard在对话框类中定义相应的处理函数,实现相关的处理功能。
二动态绘制图表实例---- 在一个温度采集系统中,希望把采集来的各项温度值实时显示,用Chart控件绘制曲线走势图:各温度项以不同颜色的曲线表示;横坐标为时间,纵坐标为温度值,均要求滚动显示;在每次采样完成后,刷新屏幕。
----设计思路随着时间的推移,采集来的数据不断增加,不一定在一屏中显示,所以系统打开一个实时数据库,存放采集来的实时数据。
显示时,需要哪个时间段的数据,就从数据库中读取。
在对话框资源编辑时,增加水平滚动条和垂直滚动条,以便配合Chart控件进行滚动显示。
为对话框启动定时器,按采样间隔进行采样,并刷新屏幕显示。
----主要相关代码如下:BOOL CAbcDlg::OnInitDialog(){CDialog::OnInitDialog();pDataDB = new dbase;//实时数据记录库,类dbase的基类为CDaoRecordsetpDataDB->Open(dbOpenDynaset, “select*from data");V ARIANT var;m_Chart.GetPlot().GetAxis(1,var).GetV alueScale().SetAuto(FALSE);//不自动标注y轴刻度m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMaximum(37);//y轴最大刻度m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMinimum(32);//y轴最小刻度m_Chart.GetPlot().GetAxis(1,var).GetV alueScale().SetMajorDivision(5);//y轴刻度5等分m_Chart.GetPlot().GetAxis(1,var).GetV alueScale().SetMinorDivision(1);//每刻度一个刻度线m_Chart.SetColumnCount(3); //3个温度项,3条曲线m_Chart.GetPlot().GetSeriesCollection().GetItem(1).GetPen().GetVtColor().Set(0, 0, 255);//线色m_Chart.GetPlot().GetSeriesCollection().GetItem(2).GetPen().GetVtColor().Set(255, 0, 0);m_Chart.GetPlot().GetSeriesCollection().GetItem(3).GetPen().GetVtColor().Set(0, 255, 0);m_Chart.GetPlot().GetSeriesCollection().GetItem(1).GetPen().SetWidth(2);//线宽m_Chart.GetPlot().GetSeriesCollection().GetItem(2).GetPen().SetWidth(2);m_Chart.GetPlot().GetSeriesCollection().GetItem(3).GetPen().SetWidth(2);m_Chart.SetRowCount(10); //一屏显示10个采样时刻m_Chart.GetPlot().GetAxis(0,var).GetCategoryScale().SetAuto(FALSE);//不自动标注x轴刻度m_Chart.GetPlot().GetAxis(0,var).GetCategoryScale().SetDivisionsPerLabel(1);//每时刻一个标注m_Chart.GetPlot().GetAxis(0,var).GetCategoryScale().SetDivisionsPerTick(1);//每时刻一个刻度线m_ScrLeft.SetScrollRange(0,45);//垂直滚动条可滚动范围(温度值范围0-50,每滚动1度,一屏显示5度)m_ScrLeft.SetScrollPos(45-32);//垂直滚动条的当前位置m_ScrBottom.SetScrollRange(0, 0);//水平滚动条的可滚动范围m_ScrBottom.SetScrollPos(0);//水平滚动条的当前位置SetTimer(23, 300000, NULL);//启动定时器,定时间隔5分钟Sample();//调用采样函数进行第一次采样,并把数据记录入库return TRUE;}void CAbcDlg::OnTimer(UINT nIDEvent) {Sample();//采样,并把数据记录入库if (pDataDB->GetRecordCount()>10)theApp.nBottomRange = pDataDB->GetRecordCount()-10;elsetheApp.nBottomRange = 0;//用全局变量保存水平滚动条的范围值m_ScrBottom.SetScrollRange(0,theApp.nBottomRange);theApp.nBottomPos = theApp.nBottomRange;m_ScrBottom.SetScrollPos(theApp.nBottomPos);//修正水平滚动条的显示DrawPic();//调用函数,刷新曲线显示CDialog::OnTimer(nIDEvent);}void CAbcDlg::DrawPic() {char s[10];UINT row = 1;pDataDB->MoveFirst();pDataDB->Move(theApp.nBottomPos);//只从数据库中取某时间段的数据进行显示while ((!pDataDB->IsEOF()) &&(row <= 10)){m_Chart.SetRow(row);m_Chart.SetRowLabel((LPCTSTR)pDataDB->m_date_time.Format(“%H:%M"));//以采样时刻做x轴的标注m_Chart.SetColumn(1);sprintf(s, “%6.2f", pDataDB->m_No1);m_Chart.SetData((LPCSTR)s);m_Chart.SetColumn(2);sprintf(s, “%6.2f", pDataDB->m_No2);m_Chart.SetData((LPCSTR)s);m_Chart.SetColumn(3);sprintf(s, “%6.2f", pDataDB->m_No3);m_Chart.SetData((LPCSTR)s);pDataDB->MoveNext();row++;}while ((row <= 10)){m_Chart.SetRow(row);m_Chart.SetRowLabel((LPCTSTR)“");m_Chart.GetDataGrid().SetData(row, 1, 0, 1);//采样数据不足10个点, 对应的位置不显示m_Chart.GetDataGrid().SetData(row, 2, 0, 1);m_Chart.GetDataGrid().SetData(row, 3, 0, 1);row++;}m_Chart.Refresh();}void CAbcDlg::OnHScroll(UINT nSBCode,UINT nPos, CScrollBar*pScrollBar) {if (pDataDB->GetRecordCount()>10)theApp.nBottomRange = pDataDB->GetRecordCount()-10;elsetheApp.nBottomRange = 0;m_ScrBottom.SetScrollRange(0, theApp.nBottomRange);switch (nSBCode){case SB_LINERIGHT:if (theApp.nBottomPos < theApp.nBottomRange){theApp.nBottomPos = theApp.nBottomPos +1;m_ScrBottom.SetScrollPos(theApp.nBottomPos);DrawPic();}break;case SB_LINELEFT:if (theApp.nBottomPos > 0){theApp.nBottomPos = theApp.nBottomPos -1;m_ScrBottom.SetScrollPos(theApp.nBottomPos);DrawPic();}break;}CDialog::OnHScroll(nSBCode, nPos, pScrollBar);}void CAbcDlg::OnVScroll(UINT nSBCode,UINT nPos, CScrollBar*pScrollBar) {V ARIANT var;double max1,min1,f;switch (nSBCode){case SB_LINEDOWN:f = m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().GetMinimum() -1;if (f>=0) {//最小刻度大于等于0, 则可以滚动m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMinimum(f);f = m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().GetMaximum() -1;m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMaximum(f);pScrollBar->SetScrollPos(pScrollBar->GetScrollPos() +1);m_Chart.Refresh();}break;case SB_LINEUP:f = m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().GetMaximum() +1;if (f <= 50) {//最大刻度小于等于50, 则可以滚动m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMaximum(f);f = m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().GetMinimum() +1;m_Chart.GetPlot().GetAxis(1, var).GetV alueScale().SetMinimum(f);pScrollBar->SetScrollPos(pScrollBar->GetScrollPos() -1);m_Chart.Refresh();}break;}CDialog::OnVScroll(nSBCode, nPos, pScrollBar);}----特别注意,程序中用到的关于控件的类,如CVcAxis等,需要在AbcDlg.cpp文件的开始处说明:#include “VcAxis.h"。