OxyPlot 在 WPF 中的使用

OxyPlot 在 WPF 中的使用

一、OxyPlot 简介

OxyPlot 是一个跨平台的 .NET 开源绘图库,采用 MIT 许可证,支持在 WPF、WinForms、UWP、Xamarin 等多平台上高效绘制图表,以其灵活性和可扩展性而著称。在 WPF 应用中,OxyPlot.Wpf 通过封装专门针对 WPF 的控件,实现了轻量级、高性能的数据可视化。

二、OxyPlot 的核心概念

在使用 OxyPlot 之前,先了解以下几个核心概念,有助于理解后续的使用方法:

概念 说明
PlotModel 图表的数据模型,是所有图表元素(边框、数据线条、坐标轴、图例等)的容器,需绑定到界面控件上
PlotView / Plot WPF 中承载图表的两种控件:PlotView 搭配代码定义模型,简单灵活;Plot 适合在 XAML 中直接配置图表内容
Axes 坐标轴集合,可分别添加四个方向的坐标轴(底/顶/左/右),默认提供底部横坐标和左侧纵坐标
Series 图表数据系列,包括 LineSeries(折线图)、BarSeries(柱状图)、PieSeries(饼图)、ScatterSeries(散点图)等多种类型
Tracker 浮动的信息提示框,类似 ToolTip,鼠标移动到数据点上时显示详细信息

OxyPlot 支持折线图、柱状图、饼图、散点图、热力图等丰富的图表类型,可满足不同场景的可视化需求。

三、快速入门

步骤1:创建 WPF 项目

在 Visual Studio 中创建一个新的 WPF 应用程序项目,目标框架建议选择 .NET Framework 4.5 或更高版本,或 .NET 6/8 等长期支持版本。

步骤2:通过 NuGet 安装 OxyPlot.Wpf

方法一:使用包管理器控制台

powershell 复制代码
PM> Install-Package OxyPlot.Wpf

或安装特定版本:

powershell 复制代码
PM> Install-Package OxyPlot.Wpf -Version 2.1.2

方法二:通过 GUI 管理 NuGet 包

  • 在解决方案资源管理器中右键点击"引用" → "管理 NuGet 包"
  • 搜索"OxyPlot",选择"OxyPlot.Wpf"并安装
步骤3:添加命名空间引用

在 XAML 文件的 Window 或 UserControl 元素中添加 OxyPlot 的命名空间引用:

二选一

xml 复制代码
xmlns:oxy="http://oxyplot.org/wpf"

四、使用方式

使用 PlotView + Code-Behind(推荐)

这种方式在 ViewModel 或 Code-Behind 中创建 PlotModel 对象,通过数据绑定将其与 XAML 中的 PlotView 关联,结构清晰,适合 MVVM 模式。

步骤1:创建 ViewModel

在 ViewModel 中定义 PlotModel 属性:

csharp 复制代码
using OxyPlot;
using OxyPlot.Series;

public class MainViewModel
{
    public MainViewModel()
    {
        // 创建 PlotModel,设置标题
        var plotModel = new PlotModel { Title = "简单折线图" };
        
        // 创建折线数据系列并添加数据点
        var series = new LineSeries
        {
            Color = OxyColors.Red,
            Title = "数据曲线"
        };
        series.Points.Add(new DataPoint(0, 1));
        series.Points.Add(new DataPoint(1, 5));
        series.Points.Add(new DataPoint(2, 3));
        series.Points.Add(new DataPoint(3, 7));
        
        plotModel.Series.Add(series);
        this.PlotModel = plotModel;
    }
    
    public PlotModel PlotModel { get; }
}

步骤2:配置 XAML 界面

在 MainWindow.xaml 中设置 DataContext 并添加 PlotView 控件:

xml 复制代码
<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:oxy="http://oxyplot.org/wpf"
        xmlns:local="clr-namespace:WpfApp"
        Title="OxyPlot 示例" Height="400" Width="600">
    
    <Window.DataContext>
        <local:MainViewModel/>
    </Window.DataContext>
    
    <Grid>
        <oxy:PlotView Model="{Binding PlotModel}" />
    </Grid>
</Window>

效果:

相关推荐
rockey62711 小时前
AScript异步执行与await关键字
c#·.net·script·eval·expression·异步执行·动态脚本
叫我少年13 小时前
ASP.NET Core 最小 API 快速参考
.net·api
枫叶林FYL14 小时前
项目九:异步高性能爬虫与数据采集中枢 —— 基于 Crawl<sub>4</sub>AI 与 Playwright 的现代化数据采集平台 项目总览
爬虫·python·深度学习·wpf
她说彩礼65万19 小时前
WPF 多值转换器
wpf
无心水1 天前
【分布式利器:金融级】金融级分布式架构开源框架全景解读
人工智能·分布式·金融·架构·开源·wpf·金融级框架
步步为营DotNet1 天前
深入.NET 11:C# 14 在边缘计算数据处理的优化与实践
c#·.net·边缘计算
她说彩礼65万1 天前
WPF 转换器
wpf
WPF工业上位机2 天前
匠心研智造,同心赴新程-WPF硬件通讯之串口&Socket
wpf
步步为营DotNet2 天前
洞悉.NET 11:Blazor 与 Microsoft.Extensions.AI 的融合创新实践
人工智能·microsoft·.net
回忆2012初秋2 天前
.NET 8.0 实战:基于 MQTTnet 封装高可用的 MQTT 发布/订阅工具类
开发语言·mqtt·.net