I'm following this example from LiveChart's documentation. The code looks like this:
<lvc:CartesianChart Margin="20" Series="{Binding SeriesCollection}" LegendLocation="Left">
<lvc:CartesianChart.AxisX>
<lvc:Axis Title="Salesman" Labels="{Binding Labels}"></lvc:Axis>
</lvc:CartesianChart.AxisX>
<lvc:CartesianChart.AxisY>
<lvc:Axis Title="Sold Apps" LabelFormatter="{Binding Formatter}"></lvc:Axis>
</lvc:CartesianChart.AxisY>
</lvc:CartesianChart>
And it looks perfect and will work perfectly for me, but there is one problem. How to change fill
color of a ColumnSeries
in this example? As I said before, I'd rather not implement another chart, because it works perfect for me, but I don't know how to change that Fill
color.
I didn't find a similar question in SO.
EDIT
Working solution:
<lvc:CartesianChart Margin="20" Series="{Binding SeriesCollection}" LegendLocation="Left">
<lvc:CartesianChart.SeriesColors>
<lvc:ColorsCollection>
<Color>Green</Color>
</lvc:ColorsCollection>
</lvc:CartesianChart.SeriesColors>
<lvc:CartesianChart.AxisX>
<lvc:Axis Title="Salesman" Labels="{Binding Labels}"></lvc:Axis>
</lvc:CartesianChart.AxisX>
<lvc:CartesianChart.AxisY>
<lvc:Axis Title="Sold Apps" LabelFormatter="{Binding Formatter}"></lvc:Axis>
</lvc:CartesianChart.AxisY>
</lvc:CartesianChart>
You can define a set of Color
objects in XAML which will implicitly map to ColumnSeries
objects in declaration order:
<lvc:CartesianChart x:Name="CartesianChart"
Series="{Binding SeriesCollection}">
<lvc:CartesianChart.SeriesColors>
<lvc:ColorsCollection>
<Color>Red</Color>
<Color>Orange</Color>
<Color>LightSlateGray</Color>
</lvc:ColorsCollection>
</lvc:CartesianChart.SeriesColors>
</lvc:CartesianChart>
Or explicitly define the Fill
of a ColumnSeries
either in XAML or C#:
public SeriesCollection SeriesCollection { get; set; } = new SeriesCollection
{
new ColumnSeries
{
Title = "Series A",
Values = new ChartValues<double> { 10, 20, 30, 20, 10},
Fill = Brushes.CornflowerBlue
},
new ColumnSeries
{
Title = "Series B",
Values = new ChartValues<double> { 100, 200, 300, 200, 100 },
Fill = Brushes.DarkOrange
}
};