WPF实现曲线数据展示【案例:震动数据分析】

wpf实现曲线数据展示,函数曲线展示,实例:震动数据分析为例。

如上图所示,如果你想实现上图中的效果,请详细参考我的内容,创作不易,给个赞吧。

一共有两种方式来实现,一种是使用第三方的框架来实现,另外一种是自己通过原创代码来一步步实现,本文主要介绍这两种曲线的实现方式。 

1.首先我创建一个wpf的解决方案项目。

2.在NuGet中添加 DynamicDataDisplay 项目支持

为了展示我们的UI界面,我们还添加了一个第三方的样式框架 Panuon.UI.Silver

3.我们在MainWindow.xaml文件中添加如下代码

<d3:ChartPlotter x:Name="plotter"><d3:Header x:Name="HeaderTitle" Visibility="Visible" Content="这是曲线的标题" FontSize="14" HorizontalAlignment="Center" /><d3:VerticalAxisTitle Content="Value" FontSize="14" Visibility="Collapsed"/><d3:HorizontalAxisTitle Content="时间" FontSize="14" Visibility="Collapsed"/></d3:ChartPlotter>

4.接下来我们就开始实现后台代码部分

  • MainWindow.xaml
    <Window x:Class="WpfApp11.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:pu="clr-namespace:Panuon.UI.Silver;assembly=Panuon.UI.Silver"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:WpfApp11"xmlns:d3="http://research.microsoft.com/DynamicDataDisplay/1.0"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid><StackPanel Panel.ZIndex="1" Margin="50,40,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Orientation="Vertical"><CheckBox x:Name="XCheckBox" IsChecked="True"pu:CheckBoxHelper.CheckBoxStyle="Standard" pu:CheckBoxHelper.BoxHeight="20" pu:CheckBoxHelper.BoxWidth="20" pu:CheckBoxHelper.CornerRadius="15"pu:CheckBoxHelper.CheckedBackground="{Binding ColorX}"><CheckBox.Content><DockPanel><TextBlock VerticalAlignment="Center" FontSize="14" FontWeight="Bold" Text="X:" Foreground="{Binding ColorX}"/><TextBlock x:Name="txtFhr1" Text="{Binding ValueX}" FontSize="32" FontWeight="Bold" Foreground="{Binding ColorX}"/></DockPanel></CheckBox.Content></CheckBox><CheckBox x:Name="YCheckBox" IsChecked="True" pu:CheckBoxHelper.CheckedBackground="{Binding ColorY}" pu:CheckBoxHelper.CheckBoxStyle="Standard" pu:CheckBoxHelper.BoxHeight="20" pu:CheckBoxHelper.BoxWidth="20" pu:CheckBoxHelper.CornerRadius="15"><CheckBox.Content><DockPanel><TextBlock VerticalAlignment="Center" FontSize="14" FontWeight="Bold" Text="Y:" Foreground="{Binding ColorY}"/><TextBlock x:Name="txtFhr2" Text="{Binding ValueY}" FontSize="32" FontWeight="Bold" Foreground="{Binding ColorY}" /></DockPanel></CheckBox.Content></CheckBox><CheckBox x:Name="ZCheckBox" IsChecked="True" pu:CheckBoxHelper.CheckedBackground="{Binding ColorZ}" pu:CheckBoxHelper.CheckBoxStyle="Standard" pu:CheckBoxHelper.BoxHeight="20" pu:CheckBoxHelper.BoxWidth="20" pu:CheckBoxHelper.CornerRadius="15"><CheckBox.Content><DockPanel><TextBlock VerticalAlignment="Center" FontSize="14" FontWeight="Bold" Text="Z:" Foreground="{Binding ColorZ}"/><TextBlock x:Name="txtFhr3" Text="{Binding ValueZ}" FontSize="32" FontWeight="Bold" Foreground="{Binding ColorZ}"/></DockPanel></CheckBox.Content></CheckBox><TextBlock VerticalAlignment="Center" FontSize="14" Text="单位:1g≈9.80 m/s²" Margin="0,10"/></StackPanel><d3:ChartPlotter x:Name="plotter" MouseMove="Plotter_MouseMove" Panel.ZIndex="0"><d3:Header x:Name="HeaderTitle" Visibility="Visible" Content="这是曲线的标题" FontSize="14" HorizontalAlignment="Center" /><d3:VerticalAxisTitle Content="Value" FontSize="14" Visibility="Collapsed"/><d3:HorizontalAxisTitle Content="时间" FontSize="14" Visibility="Collapsed"/></d3:ChartPlotter></Grid>
    </Window>
  • MainWindow.cs
    using Microsoft.Research.DynamicDataDisplay.DataSources;
    using Microsoft.Research.DynamicDataDisplay;
    using System;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Media;
    using System.Windows.Threading;
    using Microsoft.Research.DynamicDataDisplay.Charts;
    using System.Windows.Input;
    using Panuon.UI.Silver;namespace WpfApp11
    {/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{private readonly DispatcherTimer dispatcherTimer = new DispatcherTimer();private readonly LineGraph lineGraphX = new LineGraph();private readonly LineGraph lineGraphY = new LineGraph();private readonly LineGraph lineGraphZ = new LineGraph();private readonly ObservableDataSource<Point> xPoint = new ObservableDataSource<Point>();private readonly ObservableDataSource<Point> yPoint = new ObservableDataSource<Point>();private readonly ObservableDataSource<Point> zPoint = new ObservableDataSource<Point>();private readonly FontView fontView = new FontView();public MainWindow(){InitializeComponent();lineGraphX = plotter.AddLineGraph(xPoint, Colors.Red, 1.2, "X"); //#FFFF0000lineGraphY = plotter.AddLineGraph(yPoint, Colors.Green, 1.2, "Y"); //FF008000lineGraphZ = plotter.AddLineGraph(zPoint, Colors.Blue, 1.2, "Z");//FF0000FF //LineLegendItem.xaml标签HorizontalDateTimeAxis horizontalAxis = new HorizontalDateTimeAxis();horizontalAxis.ShowMinorTicks = false;horizontalAxis.LabelProvider = new DateTimeAxisControl().LabelProvider;horizontalAxis.IsDefaultAxis = true;horizontalAxis.ShowMayorLabels = false;horizontalAxis.LabelProvider.SetCustomView((info, uiElement) =>{(uiElement as TextBlock).Text = info.Tick.ToString("HH:mm:ss"); //时间轴日期格式});plotter.ContextMenu = PopulateContextMenu(plotter);plotter.HorizontalAxis.Remove(); //去除默认plotter.Children.Add(horizontalAxis); //加入新的Loaded += MainWindow_Loaded;this.XCheckBox.DataContext = fontView;this.YCheckBox.DataContext = fontView;this.ZCheckBox.DataContext = fontView;this.XCheckBox.Checked += XCheckBox_Checked;this.XCheckBox.Unchecked += XCheckBox_Checked;this.YCheckBox.Checked += YCheckBox_Checked;this.YCheckBox.Unchecked += YCheckBox_Checked;this.ZCheckBox.Checked += ZCheckBox_Checked;this.ZCheckBox.Unchecked += ZCheckBox_Checked;}#region CheckedEventprivate void XCheckBox_Checked(object sender, RoutedEventArgs e){CheckBox checkBox = sender as CheckBox;if (checkBox != null){if ((bool)checkBox.IsChecked){fontView.ColorX = fontView.IsColorX;}else{fontView.ColorX = fontView.UnColor;}}if (lineGraphX.Visibility == Visibility.Hidden){lineGraphX.Visibility = Visibility.Visible;}else{lineGraphX.Visibility = Visibility.Hidden;}}private void YCheckBox_Checked(object sender, RoutedEventArgs e){CheckBox checkBox = sender as CheckBox;if (checkBox != null){if ((bool)checkBox.IsChecked){fontView.ColorY = fontView.IsColorY;}else{fontView.ColorY = fontView.UnColor;}}if (lineGraphY.Visibility == Visibility.Hidden){lineGraphY.Visibility = Visibility.Visible;}else{lineGraphY.Visibility = Visibility.Hidden;}}private void ZCheckBox_Checked(object sender, RoutedEventArgs e){CheckBox checkBox = sender as CheckBox;if (checkBox != null){if ((bool)checkBox.IsChecked){fontView.ColorZ = fontView.IsColorZ;}else{fontView.ColorZ = fontView.UnColor;}}if (lineGraphZ.Visibility == Visibility.Hidden){lineGraphZ.Visibility = Visibility.Visible;}else{lineGraphZ.Visibility = Visibility.Hidden;}}#endregion/// <summary>/// 重写右键菜单/// </summary>/// <param name="plotter"></param>/// <returns></returns>/// <exception cref="NotImplementedException"></exception>private ContextMenu PopulateContextMenu(IInputElement target){ContextMenu result = new ContextMenu();StateIcon homeIcon = new StateIcon() { Icon = (char)Convert.ToInt32("f015", 16) + string.Empty };StateIcon saveIcon = new StateIcon() { Icon = (char)Convert.ToInt32("f2d2", 16) + string.Empty };StateIcon copyIcon = new StateIcon() { Icon = (char)Convert.ToInt32("f01a", 16) + string.Empty };StateIcon queryIcon = new StateIcon() { Icon = (char)Convert.ToInt32("f022", 16) + string.Empty };StateIcon logIcon = new StateIcon() { Icon = (char)Convert.ToInt32("f07c", 16) + string.Empty };MenuItem fitToViewMenuItem = new MenuItem{Header = "主图",ToolTip = "初始化显示,显示主图中心位置",Icon = homeIcon,Command = ChartCommands.FitToView,CommandTarget = target};MenuItem savePictureMenuItem = new MenuItem{Header = "保存",ToolTip = "保存曲线图",Icon = saveIcon,Command = ChartCommands.SaveScreenshot,CommandTarget = target};MenuItem copyPictureMenuItem = new MenuItem{Header = "拷贝",ToolTip = "拷贝,复制",Icon = copyIcon,Command = ChartCommands.CopyScreenshot,CommandTarget = target};result.Items.Add(fitToViewMenuItem);result.Items.Add(copyPictureMenuItem);result.Items.Add(savePictureMenuItem);return result;}private void MainWindow_Loaded(object sender, RoutedEventArgs e){dispatcherTimer.Interval = TimeSpan.FromMilliseconds(100);dispatcherTimer.Tick += (sender1, e1) => Timer_Tick(sender1, e1);dispatcherTimer.IsEnabled = true;}/// <summary>/// 定时器刷新界面数据/// </summary>/// <param name="sender"></param>/// <param name="e"></param>private void Timer_Tick(object sender, EventArgs e){var axis = new HorizontalDateTimeAxis();DateTime dateTime = DateTime.Now;Random random = new Random();double a, b, c;do{a = random.NextDouble() * 10;b = random.NextDouble() * 10;c = random.NextDouble() * 10;}while (a == b || b == c || a == c);Point x = new Point(axis.ConvertToDouble(dateTime), a);xPoint.AppendAsync(this.Dispatcher, x);Point y = new Point(axis.ConvertToDouble(dateTime), b);yPoint.AppendAsync(this.Dispatcher, y);Point z = new Point(axis.ConvertToDouble(dateTime), c);zPoint.AppendAsync(this.Dispatcher, z);}/// <summary>/// 鼠标选中时,X轴和Y轴的值/// </summary>/// <param name="sender"></param>/// <param name="e"></param>private void Plotter_MouseMove(object sender, MouseEventArgs e){try{DateTime dateTime = DateTime.Now;var axis = new HorizontalDateTimeAxis();axis.ConvertToDouble(dateTime);ChartPlotter chart = sender as ChartPlotter;Point point = e.GetPosition(this).ScreenToData(chart.Transform);TimeSpan ts = TimeSpan.FromMilliseconds(Math.Floor(point.X * 1000000));DateTime formattedDate = DateTime.MinValue.Add(ts);this.HeaderTitle.Content = $"速度:{point.Y.ToString("N5")} 时间:{formattedDate:HH:mm:ss,fff}";// 目标时间DateTime targetTime = formattedDate;//var select = this.Data.OrderBy(v => Math.Abs((v.DateTime - targetTime).TotalMilliseconds)).First();  // 获取与目标时间最接近的 Entity// 显示选中 Entity//this.SelectedEntity.Content = select.ToString();}catch (Exception){}}}}
    
  • FontView.cs
    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;namespace WpfApp11
    {internal class FontView : INotifyPropertyChanged{/// <summary>/// 曲线颜色/// </summary>public string UnColor => "#DCDCDC";public string IsColorX => "#FFFF0000"; //"#009C26";public string IsColorY => "#FF008000"; //"#8080C0";public string IsColorZ => "#FF0000FF"; //"#000000";public FontView(){_colorX = this.IsColorX;_colorY = this.IsColorY;_colorZ = this.IsColorZ;}private string _colorX = string.Empty;private string _colorY = string.Empty;private string _colorZ = string.Empty;public string ColorX{get { return this._colorX; }set{if (this._colorX != value){this._colorX = value;OnPropertyChanged(nameof(ColorX));}}}public string ColorY{get { return this._colorY; }set{if (this._colorY != value){this._colorY = value;OnPropertyChanged(nameof(ColorY));}}}public string ColorZ{get { return this._colorZ; }set{if (this._colorZ != value){this._colorZ = value;OnPropertyChanged(nameof(ColorZ));}}}private string x = "0.000";private string y = "0.000";private string z = "0.000";public string ValueX{get { return this.x; }set{if (this.x != value){this.x = value;OnPropertyChanged(nameof(ValueX));}}}public string ValueY{get { return this.y; }set{if (this.y != value){this.y = value;OnPropertyChanged(nameof(ValueY));}}}public string ValueZ{get { return this.z; }set{if (this.z != value){this.z = value;OnPropertyChanged(nameof(ValueZ));}}}private string node = "000000";private string time = "00:00:00,000";public string Node{get { return this.node; }set{if (this.node != value){this.node = value;OnPropertyChanged(nameof(Node));}}}public string Time{get { return this.time; }set{if (this.time != value){this.time = value;OnPropertyChanged(nameof(Time));}}}public event PropertyChangedEventHandler PropertyChanged;protected virtual void OnPropertyChanged(string propertyName){PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));}}
    }
    

以上就是全部代码了 ,创作不易,如果对你有帮助,不如点个赞吧。

附录:

DynamicDataDisplay开源项目源代码:

【CSDN文库 - DynamicDataDisplay】 

【GitHub - DynamicDataDisplay】

参考网址:

【DynamicDataDisplay 实时曲线图的使用和沿轴移动的效果 - CSDN博客】

【WPF开发随笔收录-DrawingVisual绘制高性能曲线图 - 流浪g - 博客园】

【WPF中DynamicDataDisplay的使用总结 - 低音弦 - 博客园】

【WPF实时绘制心率曲线 - 源代码实现不使用框架 - 博客园】

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/64856.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【CVE-2024-56145】PHP 漏洞导致 Craft CMS 出现 RCE

大多数开发人员都同意,与 15 年前相比,PHP 是一种更加理智、更加安全和可靠的语言。PHP5早期的不良设计已让位于更好的开发生态系统,其中包括类、自动加载、更严格的类型、更理智的语法以及一大堆其他改进。安全性也没有被忽视。 register_globals一些老读者可能还记得和的…

7 家使用量子计算的公司

劳斯莱斯、Deloitte、BASF、Roche、富士通、JPMorgan和宝马是率先开展量子计算实验的部分公司。 商用量子计算的实现仍需数年时间&#xff0c;但这并未阻止世界上一些知名企业对其进行试验。在许多情况下&#xff0c;利用当下有噪声的中等规模量子&#xff08;NISQ&#xff09…

最大似然检测在通信解调中的应用

最大似然检测&#xff08;Maximum Likelihood Detection&#xff0c;MLD&#xff09;&#xff0c;也称为最大似然序列估计&#xff08;Maximum Likelihood Sequence Estimation&#xff0c;MLSE&#xff09;&#xff0c;是一种在通信系统中广泛应用的解调方法。其核心思想是在给…

JAVA服务器端发送邮件问题 Could not connect to SMTP host

写在前面 在开发过程中&#xff0c;发送邮件经过本地测试是没有问题&#xff0c;部署到服务器上后&#xff0c;发送邮件一直报 Could not connect to SMTP host : smtp.yeah.net, port: 465 解决方法 网上各种解决方案&#xff0c;都试了一遍都未能解决这个报错问题&#xf…

完整微服务设计 功能实现

我们将以一个简单的电商系统为例&#xff0c;实现微服务架构&#xff0c;逐步用Java代码详细实现每个模块&#xff0c;并配合注释帮助小白理解。在这个实现中&#xff0c;我们使用以下工具和框架&#xff1a; Spring Boot&#xff1a;用于构建微服务。Spring Cloud&#xff1a…

Android -- 双屏异显之方法二

Android – 双屏异显之方法二: DisplayManager PS: 1. 使用改方法主板需连接至少两个输出显示屏&#xff1b; 2. 副屏内部实现与MediaRouter下一样&#xff1b;使用方法 # 主屏activity内&#xff1a; private SecondDisplay secondDisplay;private void dualScreen3288() {D…

jvm字节码中方法的结构

“-Xss”这一名称并没有一个特定的“为什么”来解释其命名&#xff0c;它更多是JVM&#xff08;Java虚拟机&#xff09;配置参数中的一个约定俗成的标识。在JVM中&#xff0c;有多个配置参数用于调整和优化Java应用程序的性能&#xff0c;这些参数通常以一个短横线“-”开头&am…

结合大语言模型的异常检测方法研究

论文链接 Research on Anomaly Detection Methodology Combining Large Language Models 论文主要内容 研究背景与目的&#xff1a; 随着大数据和人工智能技术的发展&#xff0c;异常检测在数据分析中变得越来越重要。 本研究提出了一种名为SemantEdge Detection (SED)的新…

【服务器】MyBatis是如何在java中使用并进行分页的?

MyBatis 是一个支持普通 SQL 查询、存储过程和高级映射的持久层框架。它消除了几乎所有的 JDBC 代码和参数的手动设置以及结果集的检索。MyBatis 可以通过简单的 XML 或注解来配置和映射原始类型、接口和 Java 的 POJO&#xff08;Plain Old Java Objects&#xff0c;普通老式 …

Phono3py hdf5文件数据读取与处理

Phono3py是一个主要用python写的声子-声子相互作用相关性质的模拟包&#xff0c;可以基于有限位移算法实现三阶力常数和晶格热导率的计算过程&#xff0c;同时输出包括声速&#xff0c;格林奈森常数&#xff0c;声子寿命和累积晶格热导率等参量。 相关介绍和安装请参考往期推荐…

centos7下docker 容器实现redis主从同步

1.下载redis 镜像 docker pull bitnami/redis2. 文件夹授权 此文件夹是 你自己映射到宿主机上的挂载目录 chmod 777 /app/rd13.创建docker网络 docker network create mynet4.运行docker 镜像 安装redis的master -e 是设置环境变量值 docker run -d -p 6379:6379 \ -v /a…

ManimCommunity 设置背景颜色

ManimCommunity 设置背景颜色 flyfish 主要是这句 self.camera.background_color WHITE 完整代码 class OpeningManim(Scene):def construct(self):self.camera.background_color WHITE title Tex(r"This is some \LaTeX")basel MathTex(r"\sum_{n1}^\in…

【数值特性库】入口文件

数值特性库入口文件为lib.rs。该文件定义一系列数字特性的trait&#xff08;特征&#xff09;&#xff0c;这些特性可以被不同的数字类型实现&#xff0c;从而提供一套通用的数值操作方法。下面是对代码中关键部分的解释&#xff1a; 一、基础设置 #![doc(html_root_url “h…

matlab绘图时设置左、右坐标轴为不同颜色

目录 一、需求描述 二、实现方法 一、需求描述 当图中存在两条曲线&#xff0c;需要对两条曲线进行分别描述时&#xff0c;应设置左、右坐标轴为不同颜色&#xff0c;并设置刻度线&#xff0c;且坐标轴颜色需要和曲线颜色相同。 二、实现方法 1.1、可以实现&#xff1a; 1…

【数据可视化复习方向】

1.数据可视化就是数据中信息的可视化 2.数据可视化主要从数据中寻找三个方面的信息&#xff1a;模式、关系和异常 3.大数据可视化分类&#xff1a;科学可视化、信息可视化、可视分析学 4.大数据可视化作用&#xff1a;记录信息、分析推理、信息传播与协同 5.可视化流程&…

「配置应用的可见性」功能使用教程

引言 对于「应用可见性」这一概念&#xff0c;可能很多开发者小伙伴还不是很熟悉。简单举一个很典型的场景例子&#xff0c;当你开发的应用需要调起第三方应用时&#xff0c;这里就涉及到应用可见性的问题了&#xff0c;如果不配置相关的应用可见性&#xff0c;则你的应用是无…

Pytorch | 从零构建ResNet对CIFAR10进行分类

Pytorch | 从零构建ResNet对CIFAR10进行分类 CIFAR10数据集ResNet核心思想网络结构创新点优点应用 ResNet结构代码详解结构代码代码详解BasicBlock 类ResNet 类ResNet18、ResNet34、ResNet50、ResNet101、ResNet152函数 训练过程和测试结果代码汇总resnet.pytrain.pytest.py 前…

安装MongoDB,环境配置

官网下载地址&#xff1a;MongoDB Shell Download | MongoDB 选择版本 安装 下载完成双击打开 点击mongodb-windows-x86_64-8.0.0-signed 选择安装地址 检查安装地址 安装成功 二.配置MongoDB数据库环境 1.找到安装好MongoDB的bin路径 复制bin路径 打开此电脑 -> 打开高级…

7.C语言 宏(Macro) 宏定义,宏函数

目录 宏定义 宏函数 1.注释事项 2.注意事项 宏(Macro)用法 常量定义 简单函数实现 类型检查 条件编译 宏函数计算参数个数 宏定义进行类型转换 宏定义进行位操作 宏定义进行断言 总结 宏定义 #include "stdio.h" #include "string.h" #incl…

基于高云GW5AT-15 FPGA的SLVS-EC桥MIPI设计方案分享

作者&#xff1a;Hello,Panda 一、设计需求 设计一个4Lanes SLVS-EC桥接到2组4lanes MIPI DPHY接口的电路模块&#xff1a; &#xff08;1&#xff09;CMOS芯片&#xff1a;IMX537-AAMJ-C&#xff0c;输出4lanes SLVS-EC 4.752Gbps Lane速率&#xff1b; &#xff08;2&…