概述
LiveCharts是一个比较漂亮的WPF图表控件,在数据变化时还会有动画切换的效果,并且样式也可以控制。

官方网站:Live Charts (lvcharts.net)
开源代码:GitHub - Live-Charts/Live-Charts: Simple, flexible, interactive & powerful charts, maps and gauges for .Net
本文代码基于Stylet开发,如果您还不了解Stylet,请参阅:
WPF优秀组件推荐之Stylet(一) - seabluescn - 博客园 (cnblogs.com)
WPF优秀组件推荐之Stylet(二) - seabluescn - 博客园 (cnblogs.com)
环境安装
通过Nuget引用下面两个组件;

基本使用
本文介绍一个常用的折线图的控件,其它控件请查看官方代码。
Xaml:
<lvc:CartesianChart >
<lvc:CartesianChart.Series>
<lvc:LineSeries Title="Voltage" Values="{Binding VoltageLineSeries}" />
<lvc:LineSeries Title="Current" Values="{Binding CurrentLineSeries}" />
</lvc:CartesianChart.Series>
<!--定义Y轴-->
<lvc:CartesianChart.AxisY>
<lvc:Axis Title="Voltage/Current"></lvc:Axis>
</lvc:CartesianChart.AxisY>
<!--定义X轴-->
<lvc:CartesianChart.AxisX>
<lvc:Axis Title="Samples" Labels="{Binding XTimeLabels}"/>
</lvc:CartesianChart.AxisX>
</lvc:CartesianChart>
Code:
#region LiveCharts public string[] XTimeLabels { get; set; } = new string[] { "0" }; public ChartValues<double> VoltageLineSeries { get; set; } public ChartValues<double> CurrentLineSeries { get; set; } public void ReflashDatas() { Random random = new Random(); VoltageLineSeries = new ChartValues<double>(); CurrentLineSeries = new ChartValues<double>(); Task.Run(() => { while (true) { VoltageLineSeries.Add(random.Next(200, 300)); CurrentLineSeries.Add(random.Next(1, 20)); int Count = VoltageLineSeries.Count; if (Count > 0) { XTimeLabels = new string[Count]; for (int i = 0; i < Count; i++) { XTimeLabels[i] = (i + 1).ToString(); } } Thread.Sleep(2000); } }); } #endregion
以上代码下载地址:NiceComponents · Bruce/Learn WPF - 码云 - 开源中国 (gitee.com)
参考文档:
WPF绘制图表-LiveCharts - 橘子香气 - 博客园 (cnblogs.com)
WPF LiveChart 图表详解 - 痕迹g - 博客园 (cnblogs.com)
更多资源请参考官方源码。
转自:http://Www.CnBlogs.Com/WebEnh/
如果想下次快速找到我,记得点下面的关注哦!
| 本博客Android APP 下载 |
![]() |
| 支持我们就给我们点打赏 |
![]() |
| 支付宝打赏 支付宝扫一扫二维码 |
![]() |
| 微信打赏 微信扫一扫二维码 |
![]() |
如果想下次快速找到我,记得点下面的关注哦!





浙公网安备 33010602011771号