在 LiveCharts 上自定义 class？

Question

我正在尝试在基于 MVVM 模式的 WPF 应用程序上学习和实现 LiveChart，但我很难理解如何正确实现它。假设我有一个像这样的自定义 class。我知道这个问题有点令人困惑，但我很难理解它是如何工作的，任何人都可以通过给我一个简单的例子来帮助我解决如何绘制自定义 class 基于MVVM 模式？

ErrorPrt CLASS

public class ErrorPrt
{
    public ErrorPrt()
    {
        prtName = string.Empty;
        Count = -1;
    }
    public string prtName { get; set; }
    public int Count { get; set; }
}

声明

private string[] Labels { get; set; }

public SeriesCollection seriesCollection;
private SeriesCollection SeriesCollection
{
    get { return seriesCollection; }
    set { seriesCollection = value; OnPropertyChanged("SeriesCollection"); }
}

显示图表的方法

public SeriesCollection dispalyChart(ErrorPrt[] err)
{
    SeriesCollection series = new SeriesCollection();

    List<int> vs1 = new List<int>();

    foreach (ErrorPrt e in err)
    {
        vs1.Add(e.Count);
    }

    series.Add(new ColumnSeries
    {
        Title = "REPORT",
        Values = new ChartValues<ErrorPrt> (err)
    });
    return series;
}

public string[] GetLabels(ErrorPrt[] err)
{
    string[] Labels = new string[err.Length];
    int j = 0;
    foreach(var e in err)
    {
        Labels[j] = e.prtName;
        j++;
    }
    return Labels;
}

编辑

声明为视图模型全局的图表值

class BackupStatsViewModel : INotifyPropertyChanged
{
    //OMITTED CODE
    ChartValues<DataModel> values = new ChartValues<DataModel>();

        private void InitializeBarChartData(ErrorPrt[] arr)
        {


            for (int i = 0; i < arr.Count(); i++)
                values.Add(new DataModel() { Label = $"PRT {arr[i].prtName}", Value = arr[i].Count });
            // Initialize the DataModel items

            //for (double value = 0; value < 10; value++)
            //{
            //    values.Add(new DataModel() { Label = $"Column {value + 1}", Value = value + 10 });
            //}

            // Create a labels collection from the DataModel items
            this.ColumnLabels = new ObservableCollection<string>(values.Select(dataModel => dataModel.Label));
            var dataMapper = new CartesianMapper<DataModel>()
              .Y(dataModel => dataModel.Value)
              .Fill(dataModel => dataModel.Value > 15.0 ? Brushes.Red : Brushes.Green);

            this.ChartDataSets = new SeriesCollection
            {
              new ColumnSeries
              {
                Values = values,
                Configuration = dataMapper
              }
            };
        }
    }
}

但在标签中它显示“系列”并且计数不是标签..

Answer 1

以下示例是最小的 MVVM 示例，它根据自定义数据模型绘制 ColumnSeries（条形图）：

DataModel.cs

class DataModel : INotifyPropertyChanged
{
  private double value;   
  public double Value
  {
    get => this.value;
    set 
    { 
      this.value = value; 
      OnPropertyChanged();
    }
  }

  private string label;   
  public string Label
  {
    get => this.label;
    set 
    { 
      this.label = value; 
      OnPropertyChanged();
    }
  }

  public event PropertyChangedEventHandler PropertyChanged;
  protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
  {
    this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
  }
}

ViewModel.cs

class ViewModel : INotifyPropertyChanged
{
  public SeriesCollection ChartDataSets { get; set; }
  public ObservableCollection<string> ColumnLabels { get; set; }

  public ViewModel()
  {
    InitializeBarChartData();
  }

  private void InitializeBarChartData()
  {
    // Initialize the DataModel items
    var values = new ChartValues<DataModel>();
    for (double value = 0; value < 10; value++)
    {
      values.Add(new DataModel() {Label = $"Column {value + 1}", Value = value + 10});
    }

    // Create a labels collection from the DataModel items
    this.ColumnLabels = new ObservableCollection<string>(values.Select(dataModel => dataModel.Label));

    // Define a data mapper, which tells the Chart how to extract data from the model
    // and how to map it to the corresponding axis. The mapper also allows 
    // to define a predicate which will be applied to color each data item (Fill, Stroke)
    var dataMapper = new CartesianMapper<DataModel>()
      .Y(dataModel => dataModel.Value)
      .Fill(dataModel => dataModel.Value > 15.0 ? Brushes.Red : Brushes.Green);

    this.ChartDataSets = new SeriesCollection
    {
      new ColumnSeries
      {
        Values = values,
        Configuration = dataMapper
      }
    };
  }

  public event PropertyChangedEventHandler PropertyChanged;
  protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
  {
    this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
  }
}

MainWindow.xaml

<Window>
  <Window.DataContext>
    <ViewModel />
  </Window.DataContext>

  <CartesianChart Series="{Binding ChartDataSets}">
    <CartesianChart.AxisX>
      <Axis Labels="{Binding ColumnLabels}" />
    </CartesianChart.AxisX>
  </CartesianChart>
</Window>

在 LiveCharts 上自定义 class？

Custom class on LiveCharts?

c#

wpf

mvvm

livecharts