Class MapZoomPanBehavior

Enables zooming and panning in MapShapeLayer and MapTileLayer.

Zooming and panning will start working when the new instance of MapZoomPanBehavior is set to MapShapeLayer.MapZoomPanBehavior or MapTileLayer.MapZoomPanBehavior.

However, if you need to restrict pinch zooming or panning for any specific requirements, you can set the EnablePanning, and EnableZooming properties to false respectively.

The default ZoomLevel value is 1 which will show the whole map in the viewport for MapShapeLayer and the available bounds for the MapTileLayer.

The minimum and maximum zooming levels can be restricted using the MinZoomLevel and MaxZoomLevel properties respectively. The default values of minZoomLevel and maxZoomLevel are 0 and 15 respectively.

However, for MapTileLayer, the maxZoomLevel may slightly vary depends on the providers. Check the respective official website of the map tile providers to know about the maximum zoom level it supports.

Inheritance

System.Object

MapZoomPanBehavior

Namespace: Syncfusion.Maui.Maps

Assembly: Syncfusion.Maui.Maps.dll

Syntax

public class MapZoomPanBehavior : BindableObject

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "2"
                                         MinZoomLevel= "2"
                                         MaxZoomLevel="18"
                                         EnablePanning="True"
                                         EnableZooming="True" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 2;
zoomPanBehavior.MinZoomLevel = 2;
zoomPanBehavior.MaxZoomLevel = 18;
zoomPanBehavior.EnablePanning = true;
zoomPanBehavior.EnableZooming = true;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

Constructors

MapZoomPanBehavior()

Declaration

public MapZoomPanBehavior()

Fields

EnableDoubleTapZoomingProperty

Identifies the EnableDoubleTapZooming bindable property.

Declaration

public static readonly BindableProperty EnableDoubleTapZoomingProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EnableDoubleTapZooming bindable property.

EnablePanningProperty

Identifies the EnablePanning bindable property.

Declaration

public static readonly BindableProperty EnablePanningProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EnablePanning bindable property.

EnableZoomingProperty

Identifies the EnableZooming bindable property.

Declaration

public static readonly BindableProperty EnableZoomingProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EnableZooming bindable property.

MaxZoomLevelProperty

Identifies the MaxZoomLevel bindable property.

Declaration

public static readonly BindableProperty MaxZoomLevelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MaxZoomLevel bindable property.

MinZoomLevelProperty

Identifies the MinZoomLevel bindable property.

Declaration

public static readonly BindableProperty MinZoomLevelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MinZoomLevel bindable property.

ZoomLevelProperty

Identifies the ZoomLevel bindable property.

Declaration

public static readonly BindableProperty ZoomLevelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ZoomLevel bindable property.

Properties

EnableDoubleTapZooming

Gets or sets the value indicating whether to enable or disable double tap zooming.

Declaration

public bool EnableDoubleTapZooming { get; set; }

Property Value

Type	Description
System.Boolean	true if double tap zooming is enabled; otherwise, false. The default value is true.

Remarks

EnableDoubleTapZooming decides whether to enable or disable double tap zooming.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "2"
                                         MinZoomLevel= "2"
                                         MaxZoomLevel="18"
                                         EnablePanning="True"
                                         EnableDoubleTapZooming="True"
                                         EnableZooming="True" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMap maps = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 2;
zoomPanBehavior.MinZoomLevel = 2;
zoomPanBehavior.MaxZoomLevel = 18;
zoomPanBehavior.EnablePanning = true;
zoomPanBehavior.EnableZooming = true;
zoomPanBehavior.EnableDoubleTapZooming = true;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

EnablePanning

Gets or sets a value indicating whether to enable or disable the panning.

Declaration

public bool EnablePanning { get; set; }

Property Value

Type	Description
System.Boolean	true if the panning is enabled; otherwise, false. The default value is true.

Remarks

EnablePanning decides whether to enable or disable the panning.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "2"
                                         MinZoomLevel= "2"
                                         MaxZoomLevel="18"
                                         EnablePanning="True" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 2;
zoomPanBehavior.MinZoomLevel = 2;
zoomPanBehavior.MaxZoomLevel = 18;
zoomPanBehavior.EnablePanning = true;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

EnableZooming

Gets or sets the value indicating whether to enable or disable zooming.

Declaration

public bool EnableZooming { get; set; }

Property Value

Type	Description
System.Boolean	true if zooming is enabled; otherwise, false. The default value is true.

Remarks

EnableZooming decides whether to enable or disable zooming.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "2"
                                         MinZoomLevel= "2"
                                         MaxZoomLevel="18"
                                         EnablePanning="True"
                                         EnableZooming="True" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 2;
zoomPanBehavior.MinZoomLevel = 2;
zoomPanBehavior.MaxZoomLevel = 18;
zoomPanBehavior.EnablePanning = true;
zoomPanBehavior.EnableZooming = true;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

MaxZoomLevel

Gets or sets the maximum zoom level of the map.

Declaration

public double MaxZoomLevel { get; set; }

Property Value

Type	Description
System.Double	It specifies the maximum zoom level of the map. The default value is 15.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "5"
                                         MinZoomLevel= "2"
                                         MaxZoomLevel="18" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 5;
zoomPanBehavior.MinZoomLevel = 2;
zoomPanBehavior.MaxZoomLevel = 18;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

MinZoomLevel

Gets or sets the minimum zoom level of the map.

Declaration

public double MinZoomLevel { get; set; }

Property Value

Type	Description
System.Double	It specifies the minimum zoom level of the map. The default value is 1.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "5"
                                         MinZoomLevel= "2" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 5;
zoomPanBehavior.MinZoomLevel = 2;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;

ZoomLevel

Gets or sets the current zoom level of the map.

Declaration

public double ZoomLevel { get; set; }

Property Value

Type	Description
System.Double	It specifies the current zoom level of the map. The default value is 1.

Examples

XAML
C#

<map:SfMaps>
    <map:SfMaps.Layer>
        <map:MapTileLayer UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png">
              <map:MapTileLayer.ZoomPanBehavior>
                 <map:MapZoomPanBehavior ZoomLevel = "2" />
              </map:MapTileLayer.ZoomPanBehavior>
        </map:MapTileLayer>
    </map:SfMaps.Layer>
</map:SfMaps>

SfMaps map = new SfMaps();
MapTileLayer tileLayer = new MapTileLayer();
tileLayer.UrlTemplate = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
MapZoomPanBehavior zoomPanBehavior = new MapZoomPanBehavior();
zoomPanBehavior.ZoomLevel = 2;
tileLayer.ZoomPanBehavior = zoomPanBehavior;
map.Layer = tileLayer;
this.Content = map;