C# 繪制實時折線圖,波形圖
此Demo是采用VS自帶的Chart圖表控件,制作實時動態(tài)顯示的折線圖,和波形圖。本文僅供學習分享使用,如有不足之處,還請指正。
涉及知識點:
Chart 控件,功能強大,可以繪制柱狀圖,折線圖,波形圖,餅狀圖,大大簡化了對圖的開發(fā)與定制。
Chart控件的相關概念:
- ChartArea,表示圖表區(qū)域,一個Chart可以繪制多個ChartArea,重疊在一起。
- Series ,表示數據序列,每個ChartArea可以有多個數據線。即,Series屬于ChartArea.
- AxisX,AxisY,表示主坐標軸,每一個ChartArea都有對應的坐標軸,包括主坐標軸,輔坐標軸
Queue集合,表示先進先出的集合。
主要有兩個方法:
- Dequeue() 表示移除并返回位于 System.Collections.Generic.Queue<T> 開始處的對象。
- Enqueue() 表示將對象添加到 System.Collections.Generic.Queue<T> 的結尾處。
Timer ,定時器,定時之行相應的功能,更新數據,刷新圖表。
-----------------------------------------------------------------------------------------------------------
效果圖
如下【先點擊初始化按鈕,再點擊開始按鈕】:
折線圖【折線圖,是取[0,100]之間的隨即數進行填充】:
波形圖【波形圖,是取正玄值,并放大50倍,然后上移50】
核心代碼
代碼如下:
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; using System.Windows.Forms.DataVisualization.Charting; namespace WindowsFormsApplication1 { public partial class RealChart : Form { private Queue<double> dataQueue = new Queue<double>(100); private int curValue = 0; private int num = 5;//每次刪除增加幾個點 public RealChart() { InitializeComponent(); } /// <summary> /// 初始化事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void btnInit_Click(object sender, EventArgs e) { InitChart(); } /// <summary> /// 開始事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void btnStart_Click(object sender, EventArgs e) { this.timer1.Start(); } /// <summary> /// 停止事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void btnStop_Click(object sender, EventArgs e) { this.timer1.Stop(); } /// <summary> /// 定時器事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void timer1_Tick(object sender, EventArgs e) { UpdateQueueValue(); this.chart1.Series[0].Points.Clear(); for(int i=0;i<dataQueue.Count;i++){ this.chart1.Series[0].Points.AddXY((i+1), dataQueue.ElementAt(i)); } } /// <summary> /// 初始化圖表 /// </summary> private void InitChart() { //定義圖表區(qū)域 this.chart1.ChartAreas.Clear(); ChartArea chartArea1 = new ChartArea("C1"); this.chart1.ChartAreas.Add(chartArea1); //定義存儲和顯示點的容器 this.chart1.Series.Clear(); Series series1 = new Series("S1"); series1.ChartArea = "C1"; this.chart1.Series.Add(series1); //設置圖表顯示樣式 this.chart1.ChartAreas[0].AxisY.Minimum = 0; this.chart1.ChartAreas[0].AxisY.Maximum =100; this.chart1.ChartAreas[0].AxisX.Interval = 5; this.chart1.ChartAreas[0].AxisX.MajorGrid.LineColor = System.Drawing.Color.Silver; this.chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = System.Drawing.Color.Silver; //設置標題 this.chart1.Titles.Clear(); this.chart1.Titles.Add("S01"); this.chart1.Titles[0].Text = "XXX顯示"; this.chart1.Titles[0].ForeColor = Color.RoyalBlue; this.chart1.Titles[0].Font = new System.Drawing.Font("Microsoft Sans Serif", 12F); //設置圖表顯示樣式 this.chart1.Series[0].Color = Color.Red; if (rb1.Checked) { this.chart1.Titles[0].Text =string.Format( "XXX {0} 顯示",rb1.Text); this.chart1.Series[0].ChartType = SeriesChartType.Line; } if (rb2.Checked) { this.chart1.Titles[0].Text = string.Format("XXX {0} 顯示", rb2.Text); this.chart1.Series[0].ChartType = SeriesChartType.Spline; } this.chart1.Series[0].Points.Clear(); } //更新隊列中的值 private void UpdateQueueValue() { if (dataQueue.Count > 100) { //先出列 for (int i = 0; i < num; i++) { dataQueue.Dequeue(); } } if (rb1.Checked) { Random r = new Random(); for (int i = 0; i < num; i++) { dataQueue.Enqueue(r.Next(0, 100)); } } if (rb2.Checked) { for (int i = 0; i < num; i++) { //對curValue只取[0,360]之間的值 curValue = curValue % 360; //對得到的正玄值,放大50倍,并上移50 dataQueue.Enqueue((50*Math.Sin(curValue*Math.PI / 180))+50); curValue=curValue+10; } } } } }
備注
關于定時器Timer【微軟自帶的控件】:
說明:表示在相同的時間間隔,引發(fā)用戶自定義的事情 。實現用戶需要的功能。本例中是用來定時更新隊列中的數據,并刷新圖表。
常用說明:
- Interval 時間間隔,以毫秒為單位,本例是300毫秒。
- Tick 定時觸發(fā)的事件,本例對應timer1_Tick事件方法。
- Start(),Stop() 表示定時器的啟動和停止。Enabled 表示定時器是否啟用,默認值為 false,需要手動設置為true。
由于需要源碼的比較多,故將源碼下載鏈接放于此處,請自行下載,謝謝
以上就是C# 繪制實時折線圖,波形圖的詳細內容,更多關于C# 折線圖,波形圖的資料請關注腳本之家其它相關文章!