首页 > 其他分享 >WPF随笔收录-实时绘制心率曲线

WPF随笔收录-实时绘制心率曲线

时间:2024-04-17 10:24:48浏览次数:31  
标签:推送 数据 曲线 心率 dataIndex WPF 随笔 绘制

一、前言

  在自己的项目中,涉及到实时心率曲线的绘制,项目上的曲线绘制,一般很难找到能直接用的第三方库,而且有些还是定制化的功能,所以还是自己绘制比较方便。很多人一听到自己画就害怕,感觉很难,今天就分享一个完整的实时心率数据绘制心率曲线图的例子;之前的博客也分享给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、曲线绘制的具体细节还有自定义曲线控件里涉及到的逻辑这里就不具体描述,后面会分享出代码的地址,并且尽量附上一些注释,最终实现的效果如下,曲线图会自动走纸绘制,支持拖动,支持拖动结束后,一段时间后自动恢复走纸。百万级别数据也不会卡,因为绘制的部分始终只有可见区域;

6、代码地址:https://gitee.com/liulang_g/draw-curve-demo

标签:推送,数据,曲线,心率,dataIndex,WPF,随笔,绘制
From: https://www.cnblogs.com/liulangg/p/18139940

相关文章

  • WPF/C#实现图像滤镜优化方案:打造炫目视觉体验!
    原因:我之所以想做这个项目,是因为在之前查找关于C#/WPF相关资料时,我发现讲解图像滤镜的资源非常稀缺。此外,我注意到许多现有的开源库主要基于CPU进行图像渲染。这种方式在处理大量图像时,会导致CPU的渲染负担过重。因此,我将在下文中介绍如何通过GPU渲染来有效实现图像的各种滤镜效果......
  • WPF中文网随笔(1)
    前端代码的全称为ExtensibleApplicationMarkupLanguage,简称XAML;<Application.Resources></Application.Resources>前端代码中x:Class="HelloWorld.App",它定义一个名叫App的类型,这个类型位于命令空间HelloWorld之中,与后端代码的namespaceHelloWorld保持一致。我们可以......
  • WPF基础:在Canvas上绘制图形
    Canvas介绍Canvas是WPF(WindowsPresentationFoundation)中的一种面板控件,用于在XAML中布置子元素。它提供了绝对定位的能力,允许元素在自由的二维空间中放置。Canvas上的子元素可以通过指定绝对位置(Left和Top属性)来放置,也可以使用附加属性来指定相对于Canvas的位置。Canvas对于需......
  • 美化一下WPF自带得ToolTip
    对照一下原版和美化以后得版本原版: ---------- 新版: 新增了圆角和阴影效果;第一步:新建项,最下面有一个自定义控件,取名为CornerToolTip。第二步:系统会创建一个CornerToolTip得类,默认继承自Control,我们把Control改成ToolTip:第三步:系统生成CornerToolTip类得同时,还会......
  • wpf datagrid,menuitem, style, export ,show in a another window,mvvm
    //xaml<Windowx:Class="WpfApp58.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.mic......
  • WPF 在后台代码中选中DataGrid的多行
    1///<summary>2///设置datagrid选中多行3///</summary>4///<paramname="listIndex"></param>5privatevoidSetSelectMessageIndex(List<int>listIndex)6{7......
  • WPF ContextMenu MenuItem style based on
    <Windowx:Class="WpfApp58.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.......
  • WPF开发时候遇到的问题
    1.DataGrid下的DataGridTemplateColumn的ComboBox绑定问题最开始的形式<DataGridTemplateColumnHeader="截面名称"><DataGridTemplateColumn.CellTemplate><DataTemplate><ComboBoxHorizontalAlignment=&q......
  • 第二天随笔
    目录今天的会议图片昨天完成的工作今天计划完成的工作工作中遇到的困难每人代码的签入详细请移步到项目仓库总结今天的会议图片昨天完成的工作黄永名:昨日与成员进行了沟通,编写了部分的sql语句和操作文档,对数据库的表结构和关系进行了微调。同时,分析了表的结构是否符合用户的......
  • WPF,Frame控件的一个BUG
    我使用WPF默认的frame<FrameStyle="{DynamicResourceFrameStyle1}"x:Name="frame"Height="80"NavigationUIVisibility="Visible"/>然后添加几次导航Task.Run(async()=>{this.Dispatcher.BeginInvoke(()=>this.frame.N......