Zooming And Panning

This sample uses C# 12 features, it also uses features from the CommunityToolkit.Mvvm package, you can learn more about it here.

sample image

Zooming and panning is disabled by default, you can enable it by setting the ZoomMode property, this property is of type ZoomAndPanMode, this type is a flag enum it means that you can combine the options as you need, you can learn more about zoomming and panning here.

XAML

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XamarinSample.Lines.Zoom.View"
             xmlns:lvc="clr-namespace:LiveChartsCore.SkiaSharpView.Xamarin.Forms;assembly=LiveChartsCore.SkiaSharpView.XamarinForms"
             xmlns:vms="clr-namespace:ViewModelsSamples.Lines.Zoom;assembly=ViewModelsSamples">
    <ContentPage.BindingContext>
        <vms:ViewModel/>
    </ContentPage.BindingContext>
    <lvc:CartesianChart
        Series="{Binding SeriesCollection}"
        ZoomMode="X">
    </lvc:CartesianChart>
</ContentPage>

Zoom by selection

You can also zoom by selection, this is a feature that allows you to select an area in the chart and zoom in to that area, when zooming is enabled, this feature is also enabled by default, you can also customize the trigger of this function, you can find more info here.

sample image

Articles you might also find useful:

Cartesian chart control
Line series properties