Slim Gauge
View model
using System.Collections.Generic;
using LiveChartsCore;
using LiveChartsCore.Measure;
using LiveChartsCore.SkiaSharpView;
using CommunityToolkit.Mvvm.ComponentModel;
namespace ViewModelsSamples.Pies.Gauge4;
public partial class ViewModel : ObservableObject
{
public IEnumerable<ISeries> Series { get; set; }
= new GaugeBuilder()
.WithLabelsSize(20)
.WithLabelsPosition(PolarLabelsPosition.End)
.WithLabelFormatter(point => point.PrimaryValue.ToString())
.WithInnerRadius(20)
.WithMaxColumnWidth(5)
.WithBackground(null)
.AddValue(50, "Vanessa")
.AddValue(80, "Charles")
.AddValue(95, "Ana")
.BuildSeries();
}
HTML
@page "/Pies/Gauge4"
@using LiveChartsCore.SkiaSharpView.Blazor
@using ViewModelsSamples.Pies.Gauge4
<style>
.sample-wrap {
display: inline-block;
width: 600px;
height: 600px;
}
</style>
<div class="sample-wrap">
<PieChart
Series="ViewModel.Series"
InitialRotation="-225"
MaxAngle="270"
Total="100">
</PieChart>
</div>
@code {
public ViewModel ViewModel { get; set; } = new();
}
Articles you might also find useful: