LiveCharts2总结-饼图、折线图、柱状图

已于 2024-11-20 16:41:36 修改
阅读量4.3k 收藏 27
点赞数 18
分类专栏： WPF 文章标签： wpf c# visual studio
于 2024-11-20 15:48:50 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_45666156/article/details/143593155
版权

一、下载

1、 下载NuGet包：LiveChartsCore.SkiaSharpView.WPF

2、全局中文设置：在App.xaml.cs文件添加代码，防止图表中文变“口口”

public partial class App : Application
{
    // 设置全局字体-中文
    protected override void OnStartup(StartupEventArgs e)
    {
        base.OnStartup(e);
        LiveCharts.Configure(config => config.HasGlobalSKTypeface(SKFontManager.Default.MatchCharacter('汉')));
    }
}

或者在使用Livecharts的窗口的构造函数中添加中文设置，防止此设置干扰其他窗口控件

3、添加命名空间声明

xmlns:lvc="clr-namespace:LiveChartsCore.SkiaSharpView.WPF;assembly=LiveChartsCore.SkiaSharpView.WPF"

官方文档链接：Overview.Installation - LiveCharts2icon-default.png?t=O83Ahttps://livecharts.dev/docs/WPF/2.0.0-rc4/Overview.Installation

注意下载的NuGet包版本和官方文档版本一致

二、图表

1、饼图

1. MainWindow.xaml代码

添加饼图控件PieChart

<lvc:PieChart Series="{Binding PieSeries}">
</lvc:PieChart>

2. MainWindow.xaml.cs代码

DataContext作为一个容器，提供了UI层和数据层之间的连接点。在MVVM中，DataContext主要用于在View和ViewModel之间建立数据绑定关系，这样View可以通过绑定访问ViewModel中的数据和命令。

public partial class MainWindow : Window
{
    private ViewModel _viewModel { get; set; }

    public MainWindow()
    {
        // 设置字体-中文
        LiveCharts.Configure(config => config.HasGlobalSKTypeface(SKFontManager.Default.MatchCharacter('汉')));

        _viewModel = new ViewModel();
        // 将 ViewModel 设置为主窗口的 DataContext
        DataContext = _viewModel;
        InitializeComponent();
    }
}

3. ViewModel.cs代码

创建ViewModel.cs用来绑定数据、创建图表

ViewModel处理Model提供的数据，将其转换为适合View展示的形式。所以ViewModel需要实现INotifyPropertyChanged接口用来通知UI界面修改数据。

3.1 数据绑定 

public class ViewModel : INotifyPropertyChanged
{
    // 存储饼图数据
    private ISeries[] _PieSeries;

    public ISeries[] PieSeries
    {
        get { return _PieSeries; }
        set
        {
            if (_PieSeries != value)
            {
                _PieSeries = value;
                OnPropertyChanged();
            }
        }
    }

    //数据绑定
    public event PropertyChangedEventHandler? PropertyChanged;
    
    // [CallerMemberName]用于自动传递调用者的名称。这样在调用 OnPropertyChanged 时，可以省略属性名参数。
    protected virtual void OnPropertyChanged([CallerMemberName] string? propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }   
}

 3.2 创建饼图和饼图数据设置

 在ViewModel.cs添加如下代码

public ViewModel()
{
    InitPieChart();
}

private void InitPieChart()
{
    var titles = new string[] { "A", "B", "C" };
    var data = new double[] { 1, 0, 3 };
    PieSeries = CreatePieChart(titles, data);
}

private bool _isAllZero;    // 判断饼图中是否所有数据都是0

/// <summary>
/// 创建饼图
/// </summary>
/// <param name="titles">饼图标签</param>
/// <param name="data">饼图数据</param>
/// <returns></returns>
private ISeries[] CreatePieChart(string[] titles, double[] data)
{
    ISeries[] seriesCollection;
    _isAllZero = data.All(x => x == 0);

    // 如果所有数据不都为0
    if (!_isAllZero)
    {
        // 创建饼图数据
        List<PieSeries<double>> seriesList = new List<PieSeries<double>>();
        // 定义一个颜色数组
        var colors = new SKColor[] { SKColors.DodgerBlue, SKColors.OrangeRed, SKColors.YellowGreen };
        for (int i = 0; i < titles.Length; i++)
        {
            if (data[i] != 0)
            {
                var series = new PieSeries<double>
                {
                    // 设置扇形名称
                    Name = titles[i],
                    // 设置饼图扇形数据
                    Values = new double[] { data[i] },
                    // 设置饼图扇形填充颜色
                    Fill = new SolidColorPaint(colors[i]),
                    // 设置数据标签字体大小
                    DataLabelsSize = 15,
                    // 设置数据标签颜色
                    DataLabelsPaint = new SolidColorPaint(SKColors.White),
                    // 设置数据标签位置
                    DataLabelsPosition = LiveChartsCore.Measure.PolarLabelsPosition.Middle,
                    // 设置数据标签格式化器
                    DataLabelsFormatter = point => point.Context.Series.Name + "：" + point.Coordinate.PrimaryValue.ToString(),
                    //  DataLabelsFormatter = _ => "", // 隐藏数据标签
                };
                seriesList.Add(series);
            }
        }
        seriesCollection = seriesList.ToArray();
    }
    // 如果所有数据都为0，则添加一个虚拟的系列
    else
    {
        seriesCollection = new ISeries[1];
        // 添加一个虚拟的系列，确保总有一部分被显示
        var virtualSeries = new PieSeries<double>
        {
            Name = "无",
            Values = new double[] { 1 },
            Fill = new SolidColorPaint(SKColor.Parse("#55B155")),
            // 设置数据标签字体大小
            DataLabelsSize = 15,
            // 设置数据标签颜色
            DataLabelsPaint = new SolidColorPaint(SKColors.White)
            {
                SKFontStyle = SKFontStyle.Italic,
            },
            // 设置数据标签位置
            DataLabelsPosition = LiveChartsCore.Measure.PolarLabelsPosition.Middle,
            DataLabelsFormatter = point => point.Context.Series.Name ?? "无",
            // 提示框文字格式
            ToolTipLabelFormatter = _ => "",
        };
        seriesCollection[0] = virtualSeries;
    }

    return seriesCollection;
}

左侧为数据包含零的饼图，中间为数据不为零，右侧为数据全为零

 2、折线图

与饼图不同的是，折线图属性lineChart是CartesianChart类型，通常用于存储和显示折线图、柱状图等二维坐标系图表。而ISeries[] PieSeries是饼图的数据，每个元素代表饼图中的一个扇区。所以前端绑定也不同。

1. MainWindow.xaml代码 

<lvc:CartesianChart Grid.Column="1" Margin="10,10"
                    Series="{Binding LineChart.Series}"
                    XAxes="{Binding LineChart.XAxes}"
                    YAxes="{Binding LineChart.YAxes}"
                    LegendPosition="Top"
                    LegendTextPaint="{Binding LegendTextPaint}">
</lvc:CartesianChart>

 绑定的属性依次是

  1. 绑定 Series 属性，显示图表的系列数据
  2. 绑定 YAxes 属性，配置 Y 轴
  3. 绑定 YAxes 属性，配置 Y 轴
  4. 设置图例位置为顶部
  5. 绑定图例文本的颜色

 2. ViewModel.cs代码

2.1 数据绑定

// 折线图
private CartesianChart _LineChart;

public CartesianChart LineChart
{
    get { return _LineChart; }
    set
    {
        if (_LineChart != value)
        {
            _LineChart = value;
            OnPropertyChanged();
        }
    }
}

// 柱状图和折线图图例文字颜色
public SolidColorPaint LegendTextPaint { get; set; } = new SolidColorPaint { Color = SKColors.Black};

2.2 创建折线图

/// <summary>
/// 创建折线图
/// </summary>
/// <param name="titles">图例</param>
/// <param name="data">数据</param>
/// <param name="lables">X轴标签</param>
/// <returns></returns>
private CartesianChart CreateLineChart(string[] titles, double[][] data, string[] lables)
{
    ISeries[] seriesCollection = new ISeries[titles.Length];
    // 定义一个颜色数组，用于设置折现和图例的颜色
    var colors = new SKColor[] { SKColors.Red, SKColors.YellowGreen, SKColors.MediumTurquoise, SKColors.RoyalBlue };
    for (int i = 0; i < titles.Length; i++)
    {
        var series = new LineSeries<double>
        {
            // 设置折线名称
            Name = titles[i],
            Values = new List<double>(data[i]), // 使用整个数组作为数据点
            Fill = new SolidColorPaint(SKColors.Transparent), // 移除填充颜色
            LineSmoothness = 0.2, // 设置线条平滑度
            Stroke = new SolidColorPaint(colors[i], 3),// 设置线条颜色和宽度
            GeometryStroke = new SolidColorPaint(colors[i], 3), // 设置图例及数据点颜色和宽度
            GeometrySize = 8, // 设置数据点大小
            // GeometryFill = new SolidColorPaint(SKColors.Transparent), // 设置数据点的填充颜色
        };
        seriesCollection[i] = series;
    }
    var XAxes = new Axis[]   // 配置 X 轴
    {
        new Axis
        {
            IsVisible = true,// 轴是否可见
            Name = "日期", // 轴名称
            LabelsRotation = 0, // 标签不旋转
            TextSize = 15, // 标签文字大小设置为15
            ShowSeparatorLines = false, // 不显示X轴坐标线
            NamePaint = new SolidColorPaint(SKColors.YellowGreen), // 轴名称Name的颜色
            LabelsPaint = new SolidColorPaint(SKColors.Red), // X轴标签的颜色
            TicksPaint = new SolidColorPaint(SKColors.Green) { StrokeThickness = 5 } ,// 设置刻度线的颜色和宽度
            Position = LiveChartsCore.Measure.AxisPosition.Start,  // 设置X轴的位置
            Labels = lables, // 设置X轴标签
            NameTextSize = 15, // 设置轴名称字体大小
        }
    };
    var YAxes = new Axis[]   // 配置 Y 轴
    {
        new Axis
        {
            IsVisible = true,// 轴是否可见
            Name = "数量", // 轴名称
            MinLimit=0, // 设置 Y 轴的最小值（从0开始）
            Labeler = value => Math.Floor(value).ToString(), // 设置 Y 轴标签格式，只显示整数
            LabelsPaint = new SolidColorPaint(SKColors.Gray), // Y轴标签颜色
            SeparatorsPaint = new SolidColorPaint(SKColors.SlateBlue) { StrokeThickness = 1 }, // 设置分隔线的颜色和宽度
        }
    };
    // 创建折线图

    var cartesianChart = new CartesianChart()
    {
        Series = seriesCollection, // 配置折线图
        XAxes = XAxes, // 配置 X 轴
        YAxes = YAxes, // 配置 Y 轴
    };
    return cartesianChart;
}

属性说明：

 2.3 数据设置

public ViewModel()
{
    InitPieChart();
    InitLineChart();
}

private void InitLineChart()
{
    var titles = new string[] { "A", "B", "C" };
    var data = new double[][] {
        new double[] { 1, 2, 3 },
        new double[] { 4, 5, 6 },
        new double[] { 7, 8, 9 }
    };
    var lables = new string[] { "昨天", "今天", "明天" };

    lineChart = CreateLineChart(titles, data, lables);
}

3、柱状图

1. MainWindow.xaml代码 

<lvc:CartesianChart Margin="10,10"
                    Series="{Binding ColumnChart.Series}"
                    XAxes="{Binding ColumnChart.XAxes}"
                    YAxes="{Binding ColumnChart.YAxes}"
                    LegendPosition="Top"
                    LegendTextPaint="{Binding LegendTextPaint}">
</lvc:CartesianChart>

 2. ViewModel.cs代码

2.1 数据绑定

// 柱状图
private CartesianChart _ColumnChart;

public CartesianChart ColumnChart
{
    get { return _ColumnChart; }
    set
    {
        if (_ColumnChart != value)
        {
            _ColumnChart = value;
            OnPropertyChanged();
        }
    }
}

2.2 创建柱状图 

/// <summary>
/// 创建柱状图
/// </summary>
/// <param name="titles">柱状图图例</param>
/// <param name="data">柱状图数据</param>
/// <param name="lables">柱状图X轴标签</param>
/// <returns></returns>
private CartesianChart CreateColumnChart(string[] titles, double[][] data, string[] lables)
{
    ISeries[] seriesCollection = new ISeries[titles.Length];
    var colors = new SKColor[] { SKColors.RoyalBlue, SKColors.LightGreen, SKColors.Goldenrod };
    for (int i = 0; i < titles.Length; i++)
    {
        var series = new ColumnSeries<double, LiveChartsCore.SkiaSharpView.Drawing.Geometries.RectangleGeometry>
        {
            Name = titles[i],
            Values = new List<double>(data[i]),
            Fill = new SolidColorPaint(colors[i]),
        };

        seriesCollection[i] = series;
    }
    var XAxes = new Axis[]   // 配置 X 轴
    {
        new ()
        {
            IsVisible = true,// 轴是否可见
            //Name = "X Axis", // 轴名称
            LabelsRotation = 0, // 标签不旋转
            TextSize = 15, // 标签文字大小设置为10
            ShowSeparatorLines = false, // 显示坐标线
            NamePaint = new SolidColorPaint(SKColors.Black), // 轴名称颜色
            LabelsPaint = new SolidColorPaint(SKColors.Black), // 标签颜色
            SeparatorsPaint = new SolidColorPaint(SKColors.Gray) { StrokeThickness = 1 }, // 设置分隔线的颜色和宽度
            TicksPaint = new SolidColorPaint(SKColors.Gray) { StrokeThickness = 1 } ,// 设置刻度线的颜色和宽度
            Position = LiveChartsCore.Measure.AxisPosition.Start,  // 设置轴的位置
            Labels = lables,
        }
    };
    var YAxes = new Axis[]   // 配置 Y 轴
    {
        new ()
        {
            IsVisible = true,// 轴是否可见
            //Name = "Y Axis", // 轴名称
            MinLimit=0, // 设置 Y 轴的最小值
            Labeler = value => Math.Floor(value).ToString(), // 设置 Y 轴标签格式，只显示整数
            LabelsPaint = new SolidColorPaint(SKColors.Black), // 标签颜色设置为白色
        }
    };
    var cartesianChart = new CartesianChart()
    {
        Series = seriesCollection,
        XAxes = XAxes,
        YAxes = YAxes,
    };
    return cartesianChart;
}

  属性说明：

红框标注部分可以设置图例形状，需要注意柱状图设置图例后，图表中每个柱体形状会根据所选图例形状进行改变。其他属性和折线图类似。

官方文档：samples.lines.custom - LiveCharts2

具体图例形状查看文档链接：LiveChartsCore.SkiaSharpView.Drawing.Geometries.StarGeometry - LiveCharts2

2.3 数据设置

public ViewModel()
{
    InitPieChart();
    InitLineChart();
    InitColumnChart();
}

private void InitColumnChart()
{
    var titles = new string[] { "数据一", "数据二", "数据三" };
    var data = new double[][] {
        new double[] { 1, 2, 3, 2, 1 },
        new double[] { 4, 5, 6 ,5, 4 },
        new double[] { 7, 8, 9, 8, 7 }
    };
    var lables = new string[] { "星期一", "星期二", "星期三", "星期四", "星期五" };
    ColumnChart = CreateColumnChart(titles, data, lables);
}

三、总结

饼图控件为PieChart，而折线图和柱状图的控件都为CartesianChart。

虽然前端使用相同的 CartesianChart控件来展示折线图和柱状图，但后端通过创建不同的数据系列对象（LineSeries或 ColumnSeries），实现折线图和柱状图，折线图用LineSeries，柱状图用ColumnSeries。

题外话，关于SKColors颜色

.NET开源、功能强大、跨平台的图表库
dotNET跨平台
04-27 194
前言今天大姚给大家分享一个.NET开源（MIT License）、功能强大、简单、灵活、跨平台的图表、地图和仪表库：LiveCharts2。项目介绍LiveCharts2是一个.NET开源、简单、灵活、交互式且功能强大的.NET图表、地图和仪表，现在几乎可以在任何地方运行如：Maui、Uno Platform、Blazor-wasm、WPF、WinForms、Xamarin、Avalonia、Wi...
LiveCharts2：简单灵活交互式且功能强大的.NET图表库
mingupup的博客
06-18 3085
之前的文章中提到过ScottPlot、与oxyplot，这两个是比较常用的.NET图表库，今天介绍一款新的.NET图表库：LiveCharts2。LiveCharts2 是一个现代化的数据可视化库，用于创建动态和交互式图表，支持 .NET 平台。它是 LiveCharts 的进化版，旨在提供更高性能、更灵活和更易于使用的图表解决方案。LiveCharts2 支持多种图表类型，包括折线图、柱状图、饼图、散点图等，适用于各种数据展示需求。
WPF利用LiveChart实现趋势曲线的实时更新
最新发布
qq_35977979的博客
03-05 1107
WPF利用LiveCharts实现趋势曲线的实时更新
LiveCharts2 数据可视化库入门指南
gitblog_00189的博客
08-08 1337
LiveCharts2 数据可视化库入门指南 项目地址:https://gitcode.com/gh_mirrors/li/LiveCharts2 项目介绍 什么是LiveCharts2 LiveCharts2是一款基于.NET的高性能、跨平台数据可视化库，它为开发者提供了丰富多样的图表类型，包括但不限于折线图、柱状图、饼图和散点图等。相较于前一代产品，LiveCharts2进行了全面的升级优化，...
Live-Charts
04-24
免费的chart控件，可以直接运行。
LiveCharts2--WPF折线图
hiZZ5014的博客
10-26 2006
在左上角搜索栏查询你想要的 例如：Axis、CartesianChart等。
WPF LiveCharts动态曲线(折线图）
热门推荐
熊思雨的博客
05-05 2万+
在超过图表的最大值后，X轴会自动向右边移动LiveCharts是一个比较漂亮的WPF图表控件，在数据发生变化后，还可以设置相对于的动画效果，但也有自己的缺点，比如数据量过大，可能会非常的卡，有一次，我在写柱状图时，将几个柱子的值设置成15000，结果整整卡了几十秒，在使用时还是需要注意的。安装 LiveChart：在NuGet中直接搜索 LiveChart，选择 LiveCharts.Wpf在使用的界面当中引用LiveChart.Wpf的类库。
Livechart2的简单使用，画一个折线图（wpf）
weixin_42031602的博客
03-23 1754
就是入门怎么画一个折线图，在wpf中
Live Charts
03-26
有着数十种图表显示工具，含源码和demo，一个国外的开源项目，对于WPF而言，是个非常有竞争力的项目
统计折线图-柱状图-饼图纯html-charts插件
03-31
统计折线图-柱状图-饼图纯html-charts插件 第三方引入charts图表库，原生html、js、cs，在线生成数据图表 纯js方法组装数据，设置到图表模型。生成图表 可以在折线图-柱状图之间转换 可以将生成好的图表下载到...
LiveCharts样例
11-08
wpf 图表工具LiveCharts官方样例。饼图，曲线图，柱状图等十分详细，是一个不错的学习例子。
LiveCharts使用案例集合
05-08
源码需要使用VS开发工具打开，案例中包含各种LiveChars控件的使用方式，常用的wpf和Winforms使用案例在Examples文件夹下的wpf和winforms类库中，把他们设置成对应的启动项目即可启动看案例效果。在对应工程中可看到控件的源码。
andorid-饼图&柱状图.rar
01-17
本资源包“android-饼图&柱状图.rar”提供了Android平台上实现饼图和柱状图的功能，这对于创建数据驱动的应用或者数据分析界面非常有用。下面我们将详细探讨这两种图表在Android开发中的应用和实现方式。 首先，...
统计图-饼图、折线图html页面在线生成统计图表
03-31
在数据分析和可视化领域，饼图和折线图是两种常用且直观的统计图表，它们能够帮助我们更好地理解和展示数据。本项目提供了一个基于HTML、JavaScript（JS）和CSS的在线平台，用户可以在普通的HTML页面上直接输入数据...
dotnetCHARTING winform画报表-柱状图(多柱)-折线图(多线条)-饼图 三个例子
04-10
dotnetCHARTING winform画报表-柱状图(多柱)-折线图(多线条)-饼图 三个例子
react-charts实现折线图、柱图等等各种图形
12-10
`react-charts`库是一个强大的工具，能够帮助开发者轻松创建包括折线图、柱状图、饼图在内的各种图形。这个库提供了丰富的自定义选项，使得开发者可以根据需求定制出符合项目风格的图表效果。 首先，我们来了解一下...
.NET开源、功能强大、跨平台的图表库LiveChart2
A_nanda的博客
05-13 1281
LiveCharts2 是 从LiveCharts演变而来，它修复了其前身的主要设计问题，它专注于在任何地方运行，提高了灵活性，并继承LiveCharts原有功能。
WPF显示数据图表(LiveCharts2)
zls365365的博客
05-04 5541
最近接手一个小项目，需要做一个数据显示大屏，要能显示曲线，显示进出量，重点是要好看我哪知道什么是好看，就随便做做呗。数据都是假的，只是做出一个效果。显示这种数据图，使用的是LiveCharts2。这是一个非常漂亮的Charts模块。官网如下：https://www.lvcharts.com/LiveCharts2支持的还挺多，我们在这里选择WPF。如果我们直接通过NuGet进行搜索，会发现找到的L...
C#绘制多条livecharts曲线，X坐标为实时时间，Y为值
12-05
在C#中使用LiveCharts绘制多条曲线，并将X坐标设置为实时时间，Y坐标为值，可以按照以下步骤进行： 1. **安装LiveCharts**： 首先，确保你的项目中安装了LiveCharts。你可以通过NuGet包管理器安装它。 2. **设置X轴为时间轴**： 使用`DateTimeAxis`作为X轴，并设置其格式。 3. **添加多条曲线**： 使用`LineSeries`来添加多条曲线，并为每条曲线设置不同的名称和颜色。 4. **实时更新数据**： 使用`DispatcherTimer`来定时更新数据，并刷新图表。 以下是一个完整的示例代码： ```csharp using System; using System.Windows; using System.Windows.Threading; using LiveCharts; using LiveCharts.Wpf; namespace LiveChartsExample { public partial class MainWindow : Window { private DispatcherTimer timer; private Random rand; private DateTime startTime; public MainWindow() { InitializeComponent(); rand = new Random(); startTime = DateTime.Now; // 设置X轴为时间轴 cartesianChart1.AxisX.Add(new DateTimeAxis { Title = "Time", LabelFormatter = value => new DateTime((long)value).ToString("HH:mm:ss") }); // 添加多条曲线 cartesianChart1.Series.Add(new LineSeries { Title = "Series 1", Values = new ChartValues<double>(), PointGeometry = null }); cartesianChart1.Series.Add(new LineSeries { Title = "Series 2", Values = new ChartValues<double>(), PointGeometry = null }); // 初始化定时器 timer = new DispatcherTimer(); timer.Interval = TimeSpan.FromSeconds(1); timer.Tick += Timer_Tick; timer.Start(); } private void Timer_Tick(object sender, EventArgs e) { // 更新X轴 var now = DateTime.Now; var x = now.ToOADate(); // 生成随机Y值 var y1 = rand.Next(0, 100); var y2 = rand.Next(0, 100); // 更新数据 ((LineSeries)cartesianChart1.Series[0]).Values.Add(y1); ((LineSeries)cartesianChart1.Series[1]).Values.Add(y2); // 保持数据长度 if (((LineSeries)cartesianChart1.Series[0]).Values.Count > 60) { ((LineSeries)cartesianChart1.Series[0]).Values.RemoveAt(0); ((LineSeries)cartesianChart1.Series[1]).Values.RemoveAt(0); } // 更新X轴范围 cartesianChart1.AxisX[0].MinValue = DateTime.Now.AddSeconds(-60).ToOADate(); cartesianChart1.AxisX[0].MaxValue = DateTime.Now.ToOADate(); } } } ``` 在这个示例中，我们创建了一个WPF窗口，并使用LiveCharts绘制了两条实时更新的曲线。X轴为时间轴，Y轴为随机生成的值。定时器每秒钟更新一次数据，并保持数据长度为60。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值