C# 实时曲线图

时间:2024-02-21 14:52:47

示例目的:使用时间器添加曲线图的点,以达到实时描绘曲线图的效果。X轴显示时分,Y轴显示0-20的随机数

1. 必须安装DevExpress控件,没有安装的朋友可以使用下面的云盘链接下载安装

链接:https://pan.baidu.com/s/1nXPoRsIr_RR95GHtuN4LJg

提取码:yh98

 

2. 新建Windows窗体应用程序,直接在工具箱搜索ChartControl并使用改组件

 

3. 添加曲线图,并设置其属性

当拖拉该组件到窗体设计页面时,会弹出【Chart Designer】,可在此处添加曲线图,并设置其基本属性

Series Collection:在此处添加曲线图,实例添加的是Line Series下的Line曲线

设置基本属性:

LabelsVisibility:显示点对应Y轴的数值

MARKER OPTIONS:线上的实心点设置

APPEARANCE:线的设置

 

4. 开始实现功能

 1 using DevExpress.Utils;
 2 using DevExpress.XtraCharts;
 3 using System;
 4 using System.Windows.Forms;
 5  
 6 namespace ChartControl
 7 {
 8     public partial class Form1 : Form
 9     {
10         private const int _pointsCount = 15;  //固定保留15个点
11         private int _hour = 0;
12         private int _minute = 0;
13         private SeriesPointCollection _points;
14  
15         public Form1()
16         {
17             InitializeComponent();
18             var series = chartControl1.Series[0];
19             _points = series.Points;
20  
21             #region 常用属性,可按需求设置
22             series.ArgumentScaleType = ScaleType.Qualitative;     //使用自定义时间
23             //chartControl1.ToolTipEnabled = DefaultBoolean.True; //显示曲线端点值
24             //chartControl1.ToolTipOptions.ShowForSeries = true;  //显示曲线名称
25             //chartControl1.CrosshairEnabled = DefaultBoolean.False;//隐藏十字线
26  
27             //XYDiagram diagram = (XYDiagram)chartControl1.Diagram;
28             ////设定曲线图缩放
29             //diagram.EnableAxisXScrolling = true;
30             //diagram.EnableAxisXZooming = true;
31             //diagram.EnableAxisYScrolling = true;
32             //diagram.EnableAxisYZooming = true;
33             ////设定曲线图视野,注意要先设置WholeRange
34             //diagram.AxisY.WholeRange.SetMinMaxValues(-10, 30);
35             //diagram.AxisY.VisualRange.SetMinMaxValues(-10, 30);
36             #endregion
37         }
38  
39         private void timer1_Tick(object sender, EventArgs e)
40         {
41             if (_minute >= 60)
42             {
43                 _hour += 1;
44                 _minute = 0;
45             }
46             if (_hour == 24)
47             {
48                 _hour = 0;
49             }
50             if (_points.Count >= _pointsCount)
51             {
52                 _points.RemoveAt(0);
53             }
54             var argument = $"{_hour.ToString().PadLeft(2, \'0\')}:{_minute.ToString().PadLeft(2, \'0\')}";  // X轴数据
55             var value = Math.Round(new Random().NextDouble() * 20, 2);  // Y轴数据
56             var seriesPoint = new SeriesPoint(argument, value);
57             _points.Add(seriesPoint);
58             _minute += 1;
59         }
60     }
61 }

 

 

5. 启用计时器,查看效果

 

 

有其他需求可以查看控件属性进行修改,我在这里就不详述了。

实例源码链接:https://github.com/Jcanc/ChartControl