.net---图表库(LiveCharts.Wpf)

1. LiveCharts介绍

一个灵活、简单,开源的图表库 LiveCharts.Wpf.

2. LiveCharts的使用

  1. Nuget 项目下载安装这个包
  2. 在项目中引用
xml 复制代码
<Window
    x:Class="Scottplot应用.View.MainView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:Scottplot应用.View"
    xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:scottPlot="clr-namespace:ScottPlot;assembly=ScottPlot.WPF"
    xmlns:stylet="https://github.com/canton7/Stylet"
    Title="MainWindow"
    Width="900"
    Height="750"
    mc:Ignorable="d">
    <Grid>

        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>

        <!--
            Hoverable="False":禁用图表悬停交互效果
            DisableAnimations="True":关闭所有动画效果
            Series="{Binding SeriesCollection}":通过数据绑定设置图表系列
        -->
        <lvc:CartesianChart
            x:Name="mChart"
            Background="#fff"
            DisableAnimations="True"
            Hoverable="False"
            MouseMove="mChart_MouseMove"
            Series="{Binding SeriesCollection}"
            Visibility="{Binding IsHistoryVisible}">
            <!--  SelectionMode="OnlySender":仅显示鼠标直接悬停的数据点提示  -->
            <lvc:CartesianChart.DataTooltip>
                <lvc:DefaultTooltip SelectionMode="OnlySender" />
            </lvc:CartesianChart.DataTooltip>
            <!--  AnimationsSpeed="0:0:0.5"  -->

            <!--
                Title 绑定:动态显示数据单位(如 "温度 (°C)")
                LabelFormatter:自定义 Y 轴标签格式(如数值格式化)
                MaxValue/MinValue 双向绑定:动态控制 Y 轴显示范围
                AxisSection:添加一条橙色参考线(YPointer)
                Separator:设置网格线样式(虚线,灰色)
                Unit: 时间刻度,
                Step: 多少刻度显示一个标签
            -->

            <lvc:CartesianChart.AxisY>
                <lvc:Axis Name="YAxis" Title="{Binding SelectedData.Unit, Mode=OneWay}" LabelFormatter="{Binding YFormatter}" MaxValue="{Binding YAxisMax, Mode=TwoWay}" MinValue="{Binding YAxisMin, Mode=TwoWay}">
                    <lvc:Axis.Sections>
                        <lvc:AxisSection
                            Panel.ZIndex="1"
                            DataLabel="True"
                            DataLabelForeground="White"
                            DisableAnimations="True"
                            Stroke="#ff5722"
                            StrokeThickness="1"
                            Value="{Binding YPointer}" />
                    </lvc:Axis.Sections>
                    <lvc:Axis.Separator>
                        <lvc:Separator Stroke="#404F56" StrokeDashArray="2" StrokeThickness="1" />
                    </lvc:Axis.Separator>
                </lvc:Axis>
            </lvc:CartesianChart.AxisY>
            <lvc:CartesianChart.AxisX>
                <!--Name="XAxis"  
                    Title="Time"  X轴的标题
                    LabelFormatter="{Binding DateTimeFormatter}"  标签格式化,将double数据转换成标签格式
                    MaxValue="{Binding AxisMax, Mode=TwoWay}"   X轴最大值
                    MinValue="{Binding AxisMin, Mode=TwoWay}"   X轴最小值
                    Unit="{Binding AxisUnit}"  坐标单位,定义数值与图表位置的比例关系 在时间轴上:通常设置为 TimeSpan.TicksPerSecond-->
                <lvc:Axis
                    Name="XAxis"  
                    Title="Time"
                    LabelFormatter="{Binding DateTimeFormatter}"
                    MaxValue="{Binding AxisMax, Mode=TwoWay}"
                    MinValue="{Binding AxisMin, Mode=TwoWay}"
                    Unit="{Binding AxisUnit}">
                    <lvc:Axis.Sections>
                        <!--这是一个 X轴上的垂直参考线,通常用于显示鼠标位置对应的数据点。-->
                        <!--DataLabel="True"  显示数据标签
                            DataLabelForeground="White"  数据标签的文字颜色为白色
                            DisableAnimations="True"  禁用动画效果
                            Fill="#59FF5722"  半透明橙色填充
                            SectionOffset="-0.5"  位置偏移-0.5
                            SectionWidth="1"   宽度为1
                            Stroke="#ff5722"  实线橙色边框
                            StrokeThickness=".5"  边框线宽0.5
                            Value="{Binding XPointer}" 值bind到X值 -->
                        <lvc:AxisSection
                            DataLabel="True"  
                            DataLabelForeground="White"
                            DisableAnimations="True"
                            Fill="#59FF5722"
                            SectionOffset="-0.5"
                            SectionWidth="1"
                            Stroke="#ff5722"
                            StrokeThickness=".5"
                            Value="{Binding XPointer}" />
                    </lvc:Axis.Sections>
                    <lvc:Axis.Separator>
                        <!--Step : 刻度间隔 --> 
                        <lvc:Separator StrokeThickness="0" Step="{Binding AxisStep}"/>
                    </lvc:Axis.Separator>
                </lvc:Axis>
            </lvc:CartesianChart.AxisX>
        </lvc:CartesianChart>

        <Grid Grid.Row="1">
            <Button Width="100" Height="60" Command="{stylet:Action ChangeSeries}" />
        </Grid>
    </Grid>
</Window>
相关推荐
cici158744 小时前
C#实现三菱PLC通信
java·网络·c#
CreasyChan7 小时前
Unity Shader 入门指南
unity·c#·游戏引擎·shader
ysdysyn8 小时前
C# Modbus RTU 多从站控制全攻略:一端口,双轴控制
开发语言·c#·mvvm·通讯·modbus rtu
TypingLearn9 小时前
2026年,让.NET再次伟大
windows·c#·.net·sdk·netcore
ServBay10 小时前
.NET 10 与 C# 14 更新速览,代码更少,性能更好
后端·c#·.net
玩泥巴的12 小时前
如何设计易维护、低学习成本的飞书.NET SDK组件
c#·二次开发·飞书·roslyn
Fighting_p13 小时前
【预览word文档】使用插件 docx-preview 预览线上 word 文档
开发语言·c#·word
@淡 定14 小时前
分布式事务解决方案
分布式·wpf
棉晗榜15 小时前
WPF将程序集里面嵌入的资源文件下载到本机磁盘中,将项目中的文件下载到桌面
开发语言·wpf
△曉風殘月〆16 小时前
WPF MVVM实战系列教程(一、Prism框架介绍)
wpf·mvvm·prism