探索 LiveCharts2:一款强大的跨平台图表库

9c2f425b51cd71f102aebfb720ac7b16.png

fc076d0ceb17b3de6b42f6466ddb1628.gif

8dbcac284a68fbd13bba9905bf324a85.png

你好,这里是 Dotnet 工具箱,定期分享 Dotnet 有趣,实用的工具和组件,希望对您有用!

LiveCharts2

LiveCharts2 是一个简单、灵活、交互式以及功能强大的跨平台图表库。

b8f72ec370a8bb4ff46693632bdb6d3a.png

LiveCharts2 现在几乎可以在任何地方运行,包括 Maui、Uno Platform、Blazor-wasm、WPF、WinForms、Xamarin、Avalonia、WinUI、UWP。

92eaa22748a3ee9cb692acda9ce6601e.png

LiveCharts2 (v2) 是LiveCharts (v0)的演变,它修复了其前身的主要设计问题,它专注于在任何地方运行,在不丢失在 v0 中已有的东西的情况下提高了灵活性。

d9056883b165390e73a610a27447b483.gif

LiveCharts2 的特点之一是性能优异,它使用了一些优化技巧,比如数据虚拟化、图形缓存、异步绘制等,能够在大数据量下仍然能保持良好的响应速度和渲染性能。另外,它还提供了丰富的文档和示例,方便开发者快速入手和使用。

图表示例

LiveCharts2 提供了多种类型的图表,包括折线图、面积图、柱状图、散点图、饼图等。同时,它还支持多个图表联动显示,支持动态更新数据、自定义样式和动画效果等功能。

17568f419366013ce38833bd104bb67c.png 8a75c32ad3764b033ec09718241bed87.png 39dc9040064d91cdb0d4483ad748f7d8.png

在控制台程序中生成图像

LiveCharts 可以在不需要任何 UI 框架的情况下呈现图像,只要安装 SkiaSharp View 包,就可以在服务器端或控制台应用程序中构建图像,它可以从 NuGet 安装:

LiveChartsCore.SkiaSharpView
using LiveChartsCore;
using LiveChartsCore.Geo;
using LiveChartsCore.SkiaSharpView;
using LiveChartsCore.SkiaSharpView.Drawing.Geometries;
using LiveChartsCore.SkiaSharpView.SKCharts;

var cartesianChart = new SKCartesianChart
{
    Width = 900,
    Height = 600,
    Series = new ISeries[]
    {
        new LineSeries<int> { Values = new int[] { 1, 5, 4, 6 } },
        new ColumnSeries<int> { Values = new int[] { 4, 8, 2, 4 } }
    }
};

// you can save the image to png (by default)
// or use the second argument to specify another format.
cartesianChart.SaveImage("cartesianChart.png");

var pieChart = new SKPieChart
{
    Width = 900,
    Height = 600,
    Series = new ISeries[]
    {
        new PieSeries<int> { Values = new int[] { 10, } },
        new PieSeries<int> { Values = new int[] { 6 } },
        new PieSeries<int> { Values = new int[] { 4 } }
    }
};

pieChart.SaveImage("pieChart.png");

var geoHeatMap = new SKGeoMap
{
    Width = 900,
    Height = 600,
    Series = new IGeoSeries[]
    {
        new HeatLandSeries
        {
            Lands = new HeatLand[]
            {
                new() { Name = "mex", Value = 10 },
                new() { Name = "usa", Value = 15 },
                new() { Name = "can", Value = 8 }
            }
        }
    }
};

geoHeatMap.SaveImage("geoHeatMap.png");

// alternatively you can get the image and do different operations:
using var image = cartesianChart.GetImage();
using var data = image.Encode();
var base64CartesianChart = Convert.ToBase64String(data.AsSpan());

Console.WriteLine("Images saved at the root folder!");

往期推荐:

开源的 .NET 数据库迁移框架

胡桃工具箱, 基于 .NET 开源的多功能原神工具箱

使用 C# 开源的微信/QQ/TIM 防撤回神器

推荐 3 个 .NET 流行的 Redis 客户端库

推荐一个开源的现代化的 PDF 生成组件

项目地址

在 Dotnet工具箱 公众号内,回复 303,即可获取项目地址。

047b870fb2f5300f3628f6deb1ba83c1.jpeg

Dotnet 工具箱

扫码关注我们

5304ef187895aa92a680013a5978772d.png

分享

c819c43de6da76bcba6992d4220640bc.png

点收藏

1e1325dc150e35aedc862067bbc15395.png

点点赞

b12824b3d6ccbea6beb85ac6274f93b6.png

点在看

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要在WPF自定义控件中使用LiveCharts显示两个图表,可以使用以下步骤: 1. 引用LiveCharts NuGet包。 2. 在自定义控件的XAML文件中,添加LiveCharts的命名空间:xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf" 3. 在自定义控件的XAML文件中,添加两个LiveCharts的控件(比如LineSeries、ColumnSeries等),并分别设置它们的数据源和属性。 4. 在自定义控件的代码文件中,为每个LiveCharts控件创建一个依赖属性,并在属性变化时重新绘制图表。 下面是一个简单的示例代码,其中MyCustomControl是自定义控件,其中包含两个LiveCharts控件: ```csharp public class MyCustomControl : Control { static MyCustomControl() { DefaultStyleKeyProperty.OverrideMetadata(typeof(MyCustomControl), new FrameworkPropertyMetadata(typeof(MyCustomControl))); } public SeriesCollection Series1 { get { return (SeriesCollection)GetValue(Series1Property); } set { SetValue(Series1Property, value); } } public static readonly DependencyProperty Series1Property = DependencyProperty.Register("Series1", typeof(SeriesCollection), typeof(MyCustomControl), new PropertyMetadata(null, OnSeries1PropertyChanged)); private static void OnSeries1PropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { var control = d as MyCustomControl; control.DrawChart1(); } public SeriesCollection Series2 { get { return (SeriesCollection)GetValue(Series2Property); } set { SetValue(Series2Property, value); } } public static readonly DependencyProperty Series2Property = DependencyProperty.Register("Series2", typeof(SeriesCollection), typeof(MyCustomControl), new PropertyMetadata(null, OnSeries2PropertyChanged)); private static void OnSeries2PropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { var control = d as MyCustomControl; control.DrawChart2(); } private void DrawChart1() { //绘制第一个图表 chart1.Series = Series1; } private void DrawChart2() { //绘制第二个图表 chart2.Series = Series2; } private LiveCharts.Wpf.CartesianChart chart1; private LiveCharts.Wpf.CartesianChart chart2; public override void OnApplyTemplate() { base.OnApplyTemplate(); chart1 = GetTemplateChild("PART_Chart1") as LiveCharts.Wpf.CartesianChart; chart2 = GetTemplateChild("PART_Chart2") as LiveCharts.Wpf.CartesianChart; DrawChart1(); DrawChart2(); } } ``` 在自定义控件的XAML文件中,可以使用以下代码来定义两个LiveCharts控件: ```xml <Style TargetType="{x:Type local:MyCustomControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:MyCustomControl}"> <Grid> <lvc:CartesianChart x:Name="PART_Chart1" /> <lvc:CartesianChart x:Name="PART_Chart2" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> ``` 然后,在使用自定义控件的地方,可以使用以下代码来设置两个图表的数据源: ```xml <local:MyCustomControl Series1="{Binding Data1}" Series2="{Binding Data2}" /> ``` 其中,Data1和Data2是两个SeriesCollection类型的数据源,可以在ViewModel中定义并绑定到视图中。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值