How To Add Data Points On Interactions In .NET MAUI Chart Sfcartesianchart

Updated on Sep 13, 2025

In .NET MAUI Chart, you can personalize touch behavior by overriding the OnTouchUp method in the ChartInteractiveBehavior class to add data points to the chart through touch interactions. Step 1: Create the extension class ChartInteractionExt with inherited from the ChartInteractiveBehavior class. Personalize the touch behavior by overriding the OnTouchUp method within the ChartInteractionExt class to handle the touch-up events on a chart. Use the PointToValue method to convert the touch coordinates (pointX and pointY) into corresponding data values on the X and Y axes of the SfCartesianChart).
[C#]

public class ChartInteractionExt : ChartInteractiveBehavior
{
    protected override void OnTouchUp(ChartBase chart, float pointX, float pointY)
    {
        base.OnTouchUp(chart, pointX, pointY);

        if (chart is SfCartesianChart cartesianChart)
        {
            var x = cartesianChart.PointToValue(cartesianChart.XAxes[0], pointX, pointY);
            var y = cartesianChart.PointToValue(cartesianChart.YAxes[0], pointX, pointY);

            if (cartesianChart.BindingContext is ViewModel viewModel)
            {
                viewModel.Data.Add(new Model(x, y));
            }
        }
    }
}

Step 2:
Assign the extension class ChartInteractionExt to the InteractiveBehavior property of the SfCartesianChart).
[XAML]

</chart:SfCartesianChart>
    . . .
    <chart:SfCartesianChart.InteractiveBehavior>
        <local:ChartInteractionExt/>
    </chart:SfCartesianChart.InteractiveBehavior>
</chart:SfCartesianChart>

[C#]

SfCartesianChart chart = new SfCartesianChart();
    . . .
ChartInteractionExt interaction = new ChartInteractionExt();
chart.InteractiveBehavior = interaction;
    . . .

Output Now you can add data points to the chart anywhere you prefer through touch input.