一、前言
在项目中，涉及到实时心率曲线的绘制，项目上的曲线绘制，一般很难找到能直接用的第三方库，而且有些还是定制化的功能，所以还是自己绘制比较方便。
很多人一听到自己画就害怕，感觉很难，今天就分享一个完整的实时心率数据绘制心率曲线图的例子；之前的博客也分享给DrawingVisual绘制曲线的方法，这个例子也是通过同样的方式；
二、正文
1、实时心率监护
这种项目，场景一般是硬件设备采集到心率数据，然后推送给后台汇总，然后后台通过网络再推送给客户端，客户端再进行展示。
2、模拟心率数据
这里通过加载准备好的模拟心率数据，然后结合使用定时器定时推送数据，来模拟后端给客户端推送数据的场景。
数据包里包含了三个心率数据，和一个时长的Index，一秒钟推送4个数据。
private void Init()
{
//加载心率模拟数据
using StreamReader reader = new("fhrdata.txt");
string line;
while ((line = reader.ReadLine()) != null)
{
fhrDatas.Add(int.Parse(line));
}
//定时器模拟后台定时推送心率数据
pushFhrDataTimer = new DispatcherTimer
{
Interval = TimeSpan.FromSeconds(1),
};
pushFhrDataTimer.Tick += PushFhrDataTimer_Tick;
pushFhrDataTimer.Start();
}
private void PushFhrDataTimer_Tick(object sender, EventArgs e)
{
//一秒钟推送4个数据
var fhrs = new FhrModel[4];
for (int i = 0; i < fhrs.Length; i++)
{
fhrs[i] = new FhrModel
{
Index = timeIndex,
Fhr1 = fhrDatas[dataIndex],
Fhr2 = fhrDatas[dataIndex],
Fhr3 = fhrDatas[dataIndex],
};
timeIndex++;
dataIndex++;
if (dataIndex >= fhrDatas.Count) dataIndex = 0;
}
//推送数据到心率曲线控件
chart.AddFhrData(fhrs);
}
3、自定义的心率曲线控件
这里对实际项目中的进行了简化，界面如下图所示，这里的参考线通过网格的形式绘制，纵坐标也直接绘制在网格中，横坐标是时间，绘制在底下，左上角也实时显示当前最新心率值；
4、实时心率绘制
就会涉及到曲线的一直更新绘制和移动，这里是通过每次收到一次后端推送的数据，就重新触发滑动条滚动到最新位置的事件，然后通过滑动条的滑动变化事件里面触发曲线的重新绘制。
这里的绘制还分为从左边开始和右边开始，称之为走纸方向，如下图。
5、曲线绘制
具体细节还有自定义曲线控件里涉及到的逻辑这里就不具体描述，后面会分享出代码的地址，并且尽量附上一些注释，最终实现的效果如下，曲线图会自动走纸绘制，支持拖动，支持拖动结束后，一段时间后自动恢复走纸。
百万级别数据也不会卡，因为绘制的部分始终只有可见区域；
三、源码地址
四、总结
本文通过详细的步骤和代码示例，介绍了如何在 WPF 应用程序中实时绘制心率曲线。掌握这个技巧后，可以轻松地在自己的项目中实现类似功能，提升应用程序的实时监测能力和用户体验。无论是用于健康监测还是其他应用场景，实时绘制曲线都是一个非常有用的技能。
最后
如果你觉得这篇文章对你有帮助，不妨点个赞支持一下！你的支持是我继续分享知识的动力。如果有任何疑问或需要进一步的帮助，欢迎随时留言。
也可以加入微信公众号 [DotNet技术匠] 社区，与其他热爱技术的同行一起交流心得，共同成长！
优秀是一种习惯，欢迎大家留言学习！
作者：流浪g
出处：cnblogs.com/liulangg/p/18139940
声明：网络内容，仅供学习，尊重版权，侵权速删，歉意致谢！
