Xamarin Tutorial 04 - Adding Zooming, Panning Behaviors

Source code for this tutorial can be found at our SciChart.Android.Examples Github Repository

Adding Zooming, Panning Behaviors

So far in the tutorial series, we have created a new chart, added an XAxis, YAxis, some series.

We're going to extend this now to add zoom, pan behavior to the chart. Modify the code from Xamarin Tutorial 03 - Adding Series to a Chart as follows

Adding Zoom, Pan Behaviors	Copy Code
// Create interactivity modifiers var pinchZoomModifier = new PinchZoomModifier(); pinchZoomModifier.SetReceiveHandledEvents(true); var zoomPanModifier = new ZoomPanModifier(); zoomPanModifier.SetReceiveHandledEvents(true); var zoomExtentsModifier = new ZoomExtentsModifier(); zoomExtentsModifier.SetReceiveHandledEvents(true); var yAxisDragModifier = new YAxisDragModifier(); yAxisDragModifier.SetReceiveHandledEvents(true); // Create modifier group from declared modifiers var modifiers = new ModifierGroup(pinchZoomModifier, zoomPanModifier, zoomExtentsModifier, yAxisDragModifier); // Add the interactions to the ChartModifiers collection of the chart chart.ChartModifiers.Add(modifiers);

Adding Zoom, Pan Behaviors

Copy Code

// Create interactivity modifiers
var pinchZoomModifier = new PinchZoomModifier();
pinchZoomModifier.SetReceiveHandledEvents(true);

var zoomPanModifier = new ZoomPanModifier();
zoomPanModifier.SetReceiveHandledEvents(true);

var zoomExtentsModifier = new ZoomExtentsModifier();
zoomExtentsModifier.SetReceiveHandledEvents(true);

var yAxisDragModifier = new YAxisDragModifier();
yAxisDragModifier.SetReceiveHandledEvents(true);

// Create modifier group from declared modifiers
var modifiers = new ModifierGroup(pinchZoomModifier, zoomPanModifier, zoomExtentsModifier, yAxisDragModifier);

// Add the interactions to the ChartModifiers collection of the chart
chart.ChartModifiers.Add(modifiers);

After rebuilding and running the application you should be able to pan and zoom chart.