Column Series 在 x 轴的不同间隔上用不同的颜色填充同一系列?
Column Series With different color on a different interval at x-axis fill in same series?
我正在尝试实现一个 speed/time 绘图 UI,我将 WPF 与 MVVM 模式和 beto-rodriguez 的实时图表用作我的绘图库。
我正在使用列系列。
我有两个问题:
1) 我必须在 x 轴的中间开始这个系列,该怎么做?例如,如果我将最小值设置为 7,则图表将 x 轴作为 7 开始,将其作为第一个点,但我希望 x 轴从 1 开始,但图表绘制应从 7 开始。
2) 我必须在特定条件下更改系列的颜色,比如当 x= 10 时我希望它显示为蓝色但是当 x= 17 时我只想显示与粉红色相同的系列所有点的值都应该是原来的颜色。
有指点吗?
1) 可不可以把你的ColumnSeries的值在开头填0?例如 ColumnSeries 的值将是这样的,如果你想从 7 开始你的图表:{0, 0, 0, 0, 0, 0, 10, 12, 14, 16}
2) 你能再举一个条件的例子吗?您的意思是 x=10 还是 y=10?这 Issue 与您的问题相关吗?
您有两个选择:
对每个点使用不同的系列:
<lvc:CartesianChart>
<lvc:CartesianChart.Series>
<lvc:ColumnSeries Fill="Red" />
<lvc:ColumnSeries Fill="Blue" />
您可以使用映射器设置它们,例如:https://lvcharts.net/App/examples/v1/wpf/Point%20State
您好,我用这段代码解决了这个问题:
在我的例子中,我需要包含不同颜色的实际小时数据的列。
隐藏代码:
public Brush DangerBrushFill { get; set; } = new SolidColorBrush(Colors.DarkOrange);
public Brush DangerBrushStroke { get; set; } = new SolidColorBrush(Colors.Black);
public CartesianMapper<Double> Mapper { get; set; }
public ChartValues<double> ChartValues { get; private set; }
Mapper = Mappers.Xy<Double>()
.X((item, index) => item)
.Y((item, index) => index)
.Fill((item, index) =>
(item > 0 && index == DateTime.Now.Hour - 1) ? DangerBrushFill : null)
.Stroke((item, index) =>
(item > 0 && index == DateTime.Now.Hour - 1) ? DangerBrushFill : null);
SeriesCollection = new SeriesCollection
{
new RowSeries
{
Configuration=Mapper,
Values = ChartValues,
StrokeThickness = 3
}
};
Xaml:
<lvc:CartesianChart Hoverable="False"
Series="{Binding SeriesCollection}">
希望对您有所帮助。
我正在尝试实现一个 speed/time 绘图 UI,我将 WPF 与 MVVM 模式和 beto-rodriguez 的实时图表用作我的绘图库。 我正在使用列系列。
我有两个问题: 1) 我必须在 x 轴的中间开始这个系列,该怎么做?例如,如果我将最小值设置为 7,则图表将 x 轴作为 7 开始,将其作为第一个点,但我希望 x 轴从 1 开始,但图表绘制应从 7 开始。
2) 我必须在特定条件下更改系列的颜色,比如当 x= 10 时我希望它显示为蓝色但是当 x= 17 时我只想显示与粉红色相同的系列所有点的值都应该是原来的颜色。
有指点吗?
1) 可不可以把你的ColumnSeries的值在开头填0?例如 ColumnSeries 的值将是这样的,如果你想从 7 开始你的图表:{0, 0, 0, 0, 0, 0, 10, 12, 14, 16}
2) 你能再举一个条件的例子吗?您的意思是 x=10 还是 y=10?这 Issue 与您的问题相关吗?
您有两个选择:
对每个点使用不同的系列:
<lvc:CartesianChart>
<lvc:CartesianChart.Series>
<lvc:ColumnSeries Fill="Red" />
<lvc:ColumnSeries Fill="Blue" />
您可以使用映射器设置它们,例如:https://lvcharts.net/App/examples/v1/wpf/Point%20State
您好,我用这段代码解决了这个问题: 在我的例子中,我需要包含不同颜色的实际小时数据的列。
隐藏代码:
public Brush DangerBrushFill { get; set; } = new SolidColorBrush(Colors.DarkOrange);
public Brush DangerBrushStroke { get; set; } = new SolidColorBrush(Colors.Black);
public CartesianMapper<Double> Mapper { get; set; }
public ChartValues<double> ChartValues { get; private set; }
Mapper = Mappers.Xy<Double>()
.X((item, index) => item)
.Y((item, index) => index)
.Fill((item, index) =>
(item > 0 && index == DateTime.Now.Hour - 1) ? DangerBrushFill : null)
.Stroke((item, index) =>
(item > 0 && index == DateTime.Now.Hour - 1) ? DangerBrushFill : null);
SeriesCollection = new SeriesCollection
{
new RowSeries
{
Configuration=Mapper,
Values = ChartValues,
StrokeThickness = 3
}
};
Xaml:
<lvc:CartesianChart Hoverable="False"
Series="{Binding SeriesCollection}">
希望对您有所帮助。