将实时图表饼图饼图系列值绑定到代码隐藏中的属性

Question

我有以下一个类，其中包含从数据库中获取其数据值的属性。

public partial class Fruit
{
public double Apples { get; set; }
public double Oranges { get; set; }
public double Grapes { get; set; }
public double Bananas { get; set; }
}

我想将这些属性绑定到饼系列值 实时图表饼图。

当我尝试Values="{Binding Source= Apples}"时，控件中断了。 谁能帮忙？ 我的代码如下。 C#

using LiveCharts;
using LiveCharts.Wpf;
using System;
using System.Windows;
using System.Windows.Controls;
namespace Wpf.PieChart
{
public partial class PieChartExample : UserControl
{
public Fruit Fruit => new Fruit();
public Fruit fruitData = new Fruit();
public static readonly DependencyProperty FruitPieChartModelProperty = DependencyProperty.Register(
"FruitPieChartModel",
typeof(FruitPieChartDataModel),
typeof(PieChartExample),
new PropertyMetadata(default(FruitPieChartDataModel)));
public FruitPieChartDataModel FruitPieChartModel
{
get => (FruitPieChartDataModel)GetValue(PieChartExample.FruitPieChartModelProperty);
set => SetValue(PieChartExample.FruitPieChartModelProperty, value);
}
public PieChartExample()
{
InitializeComponent();
PointLabel = chartPoint =>
string.Format("{0} ({1:P})", chartPoint.Y, chartPoint.Participation);
DataContext = this;
CreatePieChartData(fruitData);
}
private void CreatePieChartData(Fruit fruitData)
{
this.FruitPieChartModel = new FruitPieChartDataModel(fruitData);
}
public Func<ChartPoint, string> PointLabel { get; set; }
private void Chart_OnDataClick(object sender, ChartPoint chartpoint)
{
var chart = (LiveCharts.Wpf.PieChart)chartpoint.ChartView;
//clear selected slice.
foreach (PieSeries series in chart.Series)
series.PushOut = 0;
var selectedSeries = (PieSeries)chartpoint.SeriesView;
selectedSeries.PushOut = 8;
}
}
public class FruitPieChartDataModel
{
public FruitPieChartDataModel(Fruit entityFrameworkDataModel)
{
this.AppleDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Apples };
this.OrangeDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Oranges };
this.GrapeDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Grapes };
this.BananaDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Bananas };
}
public ChartValues<double> AppleDataSeries { get; set; }
public ChartValues<double> OrangeDataSeries { get; set; }
public ChartValues<double> GrapeDataSeries { get; set; }
public ChartValues<double> BananaDataSeries { get; set; }
}
public partial class Fruit
{
public double Apples { get; set; } = 6;
public double Oranges { get; set; } = 4;
public double Grapes { get; set; } = 8;
public double Bananas { get; set; } = 5;
}
}

XAML

<UserControl
x:Class="Wpf.PieChart.PieChartExample"
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:Wpf.PieChart"
xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DataContext="{d:DesignInstance local:PieChartExample}"
d:DesignHeight="300"
d:DesignWidth="500"
mc:Ignorable="d">
<Grid>
<lvc:PieChart
DataClick="Chart_OnDataClick"
DataTooltip="{x:Null}"
Hoverable="False"
LegendLocation="Bottom">
<lvc:PieChart.Series>
<lvc:PieSeries
Title="Apples"
DataLabels="True"
LabelPoint="{Binding PointLabel}"
Values="{Binding FruitPieChartModel.AppleDataSeries}" />
<lvc:PieSeries
Title="Oranges"
DataLabels="True"
LabelPoint="{Binding PointLabel}"
Values="{Binding FruitPieChartModel.OrangeDataSeries}" />
<lvc:PieSeries
Title="Grapes"
DataLabels="True"
LabelPoint="{Binding PointLabel}"
Values="{Binding FruitPieChartModel.GrapeDataSeries}" />
<lvc:PieSeries
Title="Bananas"
DataLabels="True"
LabelPoint="{Binding PointLabel}"
Values="{Binding FruitPieChartModel.BananaDataSeries}" />
</lvc:PieChart.Series>
</lvc:PieChart>
</Grid>
</UserControl>

该代码结合了BionicCode提出的宝贵建议。

不幸的是，我无法让软件运行，因为我遇到了"System.NullReferenceException："对象引用未设置为对象的实例。

请告知我做错了什么？

Answer 1

属性Apples不存在，Fruit的实例存在。您必须向UserControl添加一个属性并创建Fruit的实例。 此外，属性的类型必须是类型ChartValues<T>的集合。

由于Fruit是实体框架返回的 POCO，因此您必须为图表创建一个包装类以用作图表模型。

水果饼图数据模型.cs

public class FruitPieChartDataModel
{
public FruitPieChartDataModel(Fruit entityFrameworkDataModel)
{
this.AppleDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Apples };
this.OrangeDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Oranges };
this.GrapeDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Grapes };
this.BananaDataSeries = new ChartValues<double>() { entityFrameworkDataModel.Bananas };
}
public ChartValues<double> AppleDataSeries { get; set; }
public ChartValues<double> OrangeDataSeries { get; set; }
public ChartValues<double> GrapeDataSeries { get; set; }
public ChartValues<double> BananaDataSeries { get; set; }
}

饼图示例.xaml.cs

public partial class PieChartExample : UserControl
{   
public static readonly DependencyProperty FruitPieChartModelProperty = DependencyProperty.Register(
"FruitPieChartModel",
typeof(FruitPieChartDataModel),
typeof(PieChartExample),
new PropertyMetadata(default(FruitPieChartDataModel)));
public FruitPieChartDataModel FruitPieChartModel
{
get => (FruitPieChartDataModel) GetValue(PieChartExample.FruitPieChartModelProperty);
set => SetValue(PieChartExample.FruitPieChartModelProperty, value);
}
private void CreatePieChartData(Fruit fruitData)
{
this.FruitPieChartModel = new FruitPieChartDataModel(fruitData);
}
...
}

然后，可以将饼图绑定到 FruitPieChartModel 属性：

饼图示例.xaml

<lvc:PieSeries Title="Apples" 
Values="{Binding FruitPieChartModel.AppleDataSeries}" 
DataLabels="True"
LabelPoint="{Binding PointLabel}"/>

如果要在FruitPieChartModel属性上设置Binding(作为绑定目标(，则必须将其设置为DependencyProperty。