# cartesian-chart-line

> LineSeries chart compares Germany and England inflation rates with markers, tooltips, and a toggle legend.

**Framework:** maui  **Component:** cartesian-chart  **Variant:** line

## Get this item

**If you are an agent, fetch the JSON.** Source is inlined, so one request is enough and no tooling is required:

```
GET https://ai.syncfusion.com/r/maui/cartesian-chart-line.json
```

**Install Package(s)**

```bash
dotnet add package Syncfusion.Maui.Charts
```

**Notes**

- Syncfusion release: 2026 Volume 2 (v34.1.29)
- The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md

## Source files

### src/components/cartesian-chart-line/Chart.xaml

```xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:model="clr-namespace:MAUI.Controls.CartesianChart.LineSeries"
             xmlns:chart="clr-namespace:Syncfusion.Maui.Charts;assembly=Syncfusion.Maui.Charts"
             x:Class="MAUI.Controls.CartesianChart.LineSeries.LineSeriesView"
             x:DataType="model:LineSeriesViewModel">

    <chart:SfCartesianChart HorizontalOptions="Fill" VerticalOptions="Fill">

        <chart:SfCartesianChart.Title>
            <Label Text="Inflation - Consumer Prices"
                   FontSize="16"
                   HorizontalOptions="Fill"
                   HorizontalTextAlignment="Center" />
        </chart:SfCartesianChart.Title>

        <chart:SfCartesianChart.Legend>
            <chart:ChartLegend ToggleSeriesVisibility="True" />
        </chart:SfCartesianChart.Legend>

        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis PlotOffsetStart="10"
                                PlotOffsetEnd="10"
                                ShowMajorGridLines="False" />
        </chart:SfCartesianChart.XAxes>

        <chart:SfCartesianChart.YAxes>
            <chart:NumericalAxis Minimum="0" Maximum="100" Interval="20">
                <chart:NumericalAxis.LabelStyle>
                    <chart:ChartAxisLabelStyle LabelFormat="0'%'" />
                </chart:NumericalAxis.LabelStyle>
            </chart:NumericalAxis>
        </chart:SfCartesianChart.YAxes>

        <chart:SfCartesianChart.Series>
            <chart:LineSeries Label="Germany"
                              EnableTooltip="True"
                              ShowMarkers="True"
                              StrokeWidth="1"
                              ItemsSource="{Binding LineData1}"
                              XBindingPath="Name"
                              YBindingPath="Value" />

            <chart:LineSeries Label="England"
                              EnableTooltip="True"
                              ShowMarkers="True"
                              StrokeWidth="1"
                              ItemsSource="{Binding LineData2}"
                              XBindingPath="Name"
                              YBindingPath="Value" />
        </chart:SfCartesianChart.Series>
    </chart:SfCartesianChart>
</ContentPage>
```