上一期我们实现了串口助手收发数据之后,这期我们为我们的串口助手加上我们的波形图功能。

我们在前面有一期中介绍如何在C#中使用chart画图库

本期我们利用我们上一期制作的串口助手来实现我们的串口示波器。

准备工作

首先我们在上一期的基础上加上我们的chart库


using System.Windows.Forms.DataVisualization.Charting;

其次,简单的布置一下我们的界面。

其中图表和按钮的默认状态是隐藏的,当我们勾选波形显示时显示。


        private void ChartShow_CheckedChanged(object sender, EventArgs e)
        {
            if (ChartShow.Checked == true)
            {
                Receive.Height = 680/2;
                chart.Show();
                ClearChart.Show();
            }
            else
            {
                Receive.Height = 680;
                chart.Hide();
                ClearChart.Hide();
            }
        }

我们勾选按钮的时候,将接收区的高度减少一半,让按键和图表显形。

数据解析与存放

我们希望我们的数据格式是类似“a:xxx,b:xxx”等等。因此,我们需要解析我们的数据


private Dictionary ParseData(string input)
        {
            Dictionary
   result = new Dictionary
   ();
            // 按逗号分割字符串
            string[] pairs = input.Split(',');
            foreach (string pair in pairs)
            {
                // 再按冒号分割键值对
                string[] keyValue = pair.Split(':');
                if (keyValue.Length == 2)
                {
                    string key = keyValue[0].Trim();
                    string value = keyValue[1].Trim();
                    result[key] = value;
                }
            }

            return result;
        }

   
  
 

我们定义一个解析键值对函数,利用逗号分隔字符串,冒号分隔将解析的结果返回,这样子我们就可以获取我们的键值对。


 // 添加解析数据的代码
string[] lines = data.Split(new[] { '\r', '\n' }, StringSplitOptions.RemoveEmptyEntries);
lines = lines.Skip(1).Take(lines.Length - 2).ToArray();

由于我们的数据可能有很多行,因此我们在更新图表的代码中需要将数据按照换行符分开,并且由于第一行和最后一行的数据可能不完整,我们需要删除第一行和最后一行的数据。


foreach (string line in lines)
{
    // 对每一行进行解析
    Dictionary parsedData = ParseData(line);
    foreach (var kvp in parsedData)
    {
       // 继续处理解析后的数据
      int existingIndex = chart.Series.IndexOf(kvp.Key);
      if (existingIndex != -1)
      {
         //如果该系列的图表存在
          chart.Series[existingIndex].Points.AddXY(chart.Series[existingIndex].Points.Count, double.Parse(kvp.Value));
      }
      else
      {
        //如果该系列的图表不存在
       string seriesName = new string(kvp.Key.TakeWhile(char.IsLetter).ToArray()); // 获取字符串中的所有字母前缀
       Series newSeries = new Series(seriesName);
       newSeries.ChartType = SeriesChartType.Spline; // 设置图表类型为 Spline
       newSeries.Points.AddXY(0, double.Parse(kvp.Value));
       chart.Series.Add(newSeries);
       }
   }
}

 

我们将我们解析的数据放入图表,按照数据的前缀来划分数据。

判断图表是否存在,如果不存在就添加相应的系列。

效果展示

接着让我们看看效果



嘉立创PCB

还没有评论,抢个沙发!