时间戳

首页 > 解决方案 > LiveCharts ColumnSeries 在运行时更新颜色

c# - LiveCharts ColumnSeries 在运行时更新颜色

问题描述

我在 WPF 上使用 LiveCharts 0.9.7 和 1.2.9 Geared 版本来显示 ColumnSeries 上的人口数据。

这是我的场景：一开始，我用蓝色填充列。我想在运行时更改单个列值的颜色。

我试图达到一个值，SeriesCollection[0].Values[0]但是没有填充或颜色选项，它只是Double.

我也尝试投射SeriesCollection[0] to ColumnSeries，但我无法达到结果。是否可以在运行时更新单个值的颜色？

public SeriesCollection SeriesCollection { get; set; } = new SeriesCollection
{
  new ColumnSeries
  {
    Title = "Population of Bodrum",
    Values = new ChartValues<double> { 1500, 2500, 3700, 2000, 1000},
    Fill = Brushes.Blue
  }
};

人口柱系列

标签： c#wpflivecharts

解决方案

CartesianMapper您可以通过将 a 分配给来指定配置ColumnSeries.Configuration。

以下示例将给定图表的第三列的颜色从蓝色更改为红色：

public class ChartDataModel
{
  public ChartDataModel()
  {
    this.BlueSeries = new ColumnSeries()
    {
      Title = "Population of Bodrum",
      Values = new ChartValues<double> { 1500, 2500, 3700, 2000, 1000 },
      Fill = Brushes.Blue
    };
    this.SeriesCollection = new SeriesCollection() { this.BlueSeries };
  }

  private void ChangeThirdChartPointColorToRed()
  {
    CartesianMapper<double> mapper = Mappers.Xy<double>()
      .X((value, index) => index)
      .Y(value => value)
      .Fill((value, index) => index == 2 ? Brushes.Red : Brushes.Blue);

    // Dynamically set the third chart point color to red
    this.BlueSeries.Configuration = mapper;
  }

  // The actual chart data source
  public SeriesCollection SeriesCollection { get; set; }

  private ColumnSeries BlueSeries { get; set; }
}

您还可以通过指定相应的谓词，使用CartesianMapper来根据其y值更改点的颜色。要绘制所有超过 2,000 红色值的值，您可以使用以下映射器：

 CartesianMapper<double> mapper = Mappers.Xy<double>()
   .X((value, index) => index)
   .Y(value => value)
   .Fill((value, index) => value > 2000 ? Brushes.Red : Brushes.Blue);

推荐阅读