Suchst du nach einer leistungsstarken Bibliothek für Charts in .NET MAUI? Viele Entwickler greifen zunächst zu Microcharts, stellen aber schnell fest, dass die Bibliothek nicht mehr aktiv gepflegt wird und unter .NET 8 Probleme bereitet. Die Lösung ist LiveCharts2: eine moderne, performante und aktiv gewartete Microcharts Alternative, die deine Datenvisualisierung auf das nächste Level hebt.
In diesem Tutorial zeige ich dir, wie du mit LiveCharts2 beeindruckende und interaktive Diagramme in deine .NET MAUI-Anwendungen integrierst – von der Installation bis hin zu komplexen Kombinations-Charts mit Tooltips, Zoom und Panning.
LiveCharts2 ist die ideale Charting-Bibliothek für moderne .NET MAUI-Projekte. Die wichtigsten Vorteile auf einen Blick:
Kurz gesagt: Wenn du performante und zukunftssichere .NET MAUI Charts benötigst, ist LiveCharts2 die beste Wahl.
Installiere zunächst das LiveCharts2-Paket für .NET MAUI in deinem Projekt:
dotnet add package LiveChartsCore.SkiaSharpView.Maui
Und initialisiere die Bibliothek in MauiProgram.cs:
using LiveChartsCore.SkiaSharpView.Maui;
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.UseLiveCharts(); // Initialisierung von LiveCharts
return builder.Build();
}
}
XAML:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:liveCharts="clr-namespace:LiveChartsCore.SkiaSharpView.Maui;assembly=LiveChartsCore.SkiaSharpView.Maui"
x:Class="ChartingDemo.MainPage">
<VerticalStackLayout>
<liveCharts:CartesianChart x:Name="MyChart" />
</VerticalStackLayout>
</ContentPage>
Code-Behind (MainPage.xaml.cs):
using LiveChartsCore;
using LiveChartsCore.SkiaSharpView;
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
MyChart.Series = new ISeries[]
{
new ColumnSeries<double>
{
Values = new double[] { 10, 20, 30, 40 }
}
};
}
}
If you have a project in Xamarin or .NET MAUI, we can help you save time.
Before proceeding on your own, take a look at our services. Our team of experienced developers is enthusiastic about discussing your project and helping you finish with an excellent standard.
Have a look at app development services
MyChart.TooltipPosition = LiveChartsCore.Measure.TooltipPosition.Top;
MyChart.TooltipAutoPlacement = true;
MyChart.ZoomMode = LiveChartsCore.Measure.ZoomAndPanMode.X; // Nur horizontaler Zoom
MyChart.PanMode = LiveChartsCore.Measure.PanMode.X; // Nur horizontales Panning
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
MyChart.Series = new ISeries[]
{
new LineSeries<double>
{
Values = new double[] { 5, 8, 3, 10, 7 },
Fill = null // Kein Bereich unter der Linie füllen
}
};
MyChart.ZoomMode = LiveChartsCore.Measure.ZoomAndPanMode.X;
MyChart.PanMode = LiveChartsCore.Measure.PanMode.X;
MyChart.TooltipPosition = LiveChartsCore.Measure.TooltipPosition.Top;
MyChart.TooltipAutoPlacement = true;
}
}
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
MyChart.Series = new ISeries[]
{
new ColumnSeries<double>
{
Values = new double[] { 5, 6, 7, 8 },
Name = "Sales"
},
new LineSeries<double>
{
Values = new double[] { 6, 6, 7, 7 },
Name = "Average",
Fill = null
}
};
MyChart.ZoomMode = LiveChartsCore.Measure.ZoomAndPanMode.X;
MyChart.PanMode = LiveChartsCore.Measure.PanMode.X;
MyChart.TooltipPosition = LiveChartsCore.Measure.TooltipPosition.Top;
MyChart.TooltipAutoPlacement = true;
}
}
Eine Übersicht aller verfügbaren Diagrammtypen wie Säulen-, Linien-, Kreis-, Donut-, Heatmaps u.v.m. findest du in der LiveCharts2 Galerie: LiveCharts2 MAUI Chart-Galerie.
Um dir den Einstieg noch leichter zu machen, habe ich ein kleines Beispielprojekt erstellt:
Features:
GitHub-Link: LiveCharts2-Maui-Sample
Viele Entwickler suchen aktuell nach einer zukunftssicheren Alternative zu Microcharts, da die Wartung stockt und z.B. für .NET9 keine Updates mehr erscheinen. Das bestätigen auch Diskussionen wie dieses offene Issue auf GitHub.
LiveCharts2 bietet genau das: Ein modernes API-Design, MAUI-Unterstützung, Performance und Interaktivität – inklusive aktiver Weiterentwicklung.
Mit LiveCharts2 in .NET MAUI kannst du:
Du möchtest nicht nur schöne Charts, sondern eine performante, skalierbare .NET MAUI-App?
Wir bei Cayas Software entwickeln seit über 12 Jahren hochwertige Mobile- und Cross-Plattform-Anwendungen – maßgeschneidert für Unternehmen, die mehr erwarten. Ob Migration von Xamarin, individuelle UI/UX-Konzepte oder vollständige App-Projekte mit .NET MAUI: Wir begleiten dich vom ersten Entwurf bis zur erfolgreichen Veröffentlichung – kompetent, partnerschaftlich, zuverlässig.
Jetzt mehr über unsere .NET MAUI App-Entwicklung erfahren.
Als Mobile-Enthusiast und Geschäftsführer der Cayas Software GmbH ist es mir ein großes Anliegen, mein Team und unsere Kunden zu unterstützen, neue potenziale zu entdecken und gemeinsam zu wachsen. Hier schreibe ich vor allem zur Entwicklung von Android und iOS-Apps mit Xamarin und .NET MAUI.
Ich arbeite derzeit an der Portierung einer Xamarin Forms App zu .NET MAUI. Die App verwendet auch Karten von Apple oder Google Maps, um Standorte anzuzeigen. Obwohl es bis zur Veröffentlichung von .NET 7 keine offizielle Unterstützung in MAUI gab, möchte ich Ihnen eine Möglichkeit zeigen, Karten über einen benutzerdefinierten Handler anzuzeigen.
.NET MAUI ermöglicht es uns, plattform- und geräteunabhängige Anwendungen zu schreiben, was eine dynamische Anpassung an die Bildschirmgröße und -form des Benutzers erforderlich macht. In diesem Blog-Beitrag erfahren Sie, wie Sie Ihre XAML-Layouts an unterschiedliche Geräteausrichtungen anpassen können. Dabei verwenden Sie eine ähnliche Syntax wie OnIdiom und OnPlatform, die Ihnen vielleicht schon bekannt ist.
This post is a continuation of the Hackathon topic post, where the technical implementation of voice commands in .NET MAUI is revealed, as well as the challenges the development team faced and how they successfully solved them.