Stacked Bars
This sample uses C# 13 preview features such as partial properties, it also uses features from the CommunityToolkit.Mvvm package, you can learn more about it here.
View Model
using System;
using LiveChartsCore.Kernel;
namespace ViewModelsSamples.StackedBars.Basic;
public class ViewModel
{
public int[] Values1 { get; set; } =
[3, 5, -3, 2, 5, -4, -2];
public int[] Values2 { get; set; } =
[4, 2, -3, 2, 3, 4, -2];
public int[] Values3 { get; set; } =
[-2, 6, 6, 5, 4, 3, -2];
public Func<ChartPoint, string> Formatter { get; set; } =
p => $"{p.Coordinate.PrimaryValue:N} ({p.StackedValue!.Share:P})";
}
XAML
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="MauiSample.StackedBars.Basic.View"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:lvc="clr-namespace:LiveChartsCore.SkiaSharpView.Maui;assembly=LiveChartsCore.SkiaSharpView.Maui"
xmlns:vms="clr-namespace:ViewModelsSamples.StackedBars.Basic;assembly=ViewModelsSamples"
x:DataType="vms:ViewModel">
<ContentPage.BindingContext>
<vms:ViewModel/>
</ContentPage.BindingContext>
<lvc:CartesianChart>
<lvc:CartesianChart.Series>
<lvc:SeriesCollection>
<lvc:XamlStackedColumnSeries
Values="{Binding Values1}"
ShowDataLabels="True"
YToolTipLabelFormatter="{Binding Formatter}"/>
<lvc:XamlStackedColumnSeries
Values="{Binding Values2}"
ShowDataLabels="True"
YToolTipLabelFormatter="{Binding Formatter}"/>
<lvc:XamlStackedColumnSeries
Values="{Binding Values3}"
ShowDataLabels="True"
YToolTipLabelFormatter="{Binding Formatter}"/>
</lvc:SeriesCollection>
</lvc:CartesianChart.Series>
</lvc:CartesianChart>
</ContentPage>
