MapZoomPanBehavior class Null safety

Enables zooming and panning in MapShapeLayer and MapTileLayer.

Zooming and panning will start working when the new instance of MapZoomPanBehavior is set to MapShapeLayer.zoomPanBehavior or MapTileLayer.zoomPanBehavior. However, if you need to restrict pinch zooming or double tap zooming or panning for any specific requirements, you can set the enablePinching, enableDoubleTapZooming, and enablePanning properties to false respectively.

The focalLatLng is the focal point of the map layer based on which zooming happens.

The default zoomLevel value is 1 which will show the whole map in the viewport for MapShapeLayer and the available bounds for the MapTileLayer based on the focalLatLng (Please check the documentation of MapTileLayer to know more details about how zoomLevel works in it).

You can also get the current zoom level and focal position of the map layer using the zoomLevel and focalLatLng after the interaction.

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.

By default, there is a toolbar for the zooming operations for the web platform. However, you can change its visibility using the MapZoomPanBehavior.showToolbar property.

MapZoomPanBehavior objects are expected to be long-lived, not recreated with each build.

The procedure and the behavior are similar for both the MapShapeLayer and MapTileLayer.

late MapZoomPanBehavior _zoomPanBehavior;
late MapShapeSource _mapSource;

@override
void initState() {
  _mapSource = MapShapeSource.asset(
    'assets/world_map.json',
    shapeDataField: 'continent',
  );
  _zoomPanBehavior = MapZoomPanBehavior()
    ..zoomLevel = 4
    ..focalLatLng = MapLatLng(19.0759837, 72.8776559)
    ..toolbarSettings = MapToolbarSettings();
  super.initState();
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('Zoom pan'),
    ),
    body: SfMaps(
      layers: [
        MapShapeLayer(
          source: _mapSource,
          zoomPanBehavior: _zoomPanBehavior,
        ),
      ],
    ),
  );
}
Inheritance

Constructors

MapZoomPanBehavior({double zoomLevel = kDefaultMinZoomLevel, MapLatLng? focalLatLng, MapLatLngBounds? latLngBounds, double minZoomLevel = kDefaultMinZoomLevel, double maxZoomLevel = kDefaultMaxZoomLevel, bool enablePinching = true, bool enablePanning = true, bool enableDoubleTapZooming = false, bool showToolbar = true, MapToolbarSettings toolbarSettings = const MapToolbarSettings()})
Creates a new MapZoomPanBehavior.

Properties

enableDoubleTapZooming bool
Enables double tap across the map layer. [...]
read / write
enablePanning bool
Enables panning across the map layer. [...]
read / write
enablePinching bool
Option to enable pinch zooming support. [...]
read / write
focalLatLng MapLatLng?
The focalLatLng is the focal point of the map layer based on which zooming happens. [...]
read / write
hashCode int
The hash code for this object. [...]
read-only, inherited
latLngBounds MapLatLngBounds?
Specifies the current latlng bounds of the maps. The maps zoom level and focalLatLng get updated based on the given bounds. [...]
read / write
maxZoomLevel double
Maximum zoom level of the map layer. [...]
read / write
minZoomLevel double
Minimum zoom level of the map layer. [...]
read / write
renderBox RenderBox
Render box of the internal widget which handles the MapZoomPanBehavior. [...]
read-only, inherited
runtimeType Type
A representation of the runtime type of the object.
read-only, inherited
showToolbar bool
Shows zooming toolbar in the web platform. [...]
read / write
toolbarSettings MapToolbarSettings
Provides options for customizing the appearance of the toolbar in the web platform.
read / write
zoomLevel double
Current zoom level of the map layer. [...]
read / write

Methods

debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children. [...]
@protected, inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node. [...]
override
handleEvent(PointerEvent event) → void
Override this method to handle pointer events that hit this render box.
@mustCallSuper, inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
onPanning(MapPanDetails details) → void
Called whenever panning is happening. [...]
onZooming(MapZoomDetails details) → void
Called whenever zooming is happening. [...]
paint(PaintingContext context, Offset offset) → void
Paints this render box into the given context at the given offset.
inherited
reset() → void
When this method is called, the map will be reset to the MapZoomPanBehavior.minZoomLevel.
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep. [...]
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object. [...]
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a string representation of this node and its descendants. [...]
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object. [...]
inherited
toStringShort() String
A brief description of this object, usually just the runtimeType and the hashCode. [...]
inherited

Operators

operator ==(Object other) bool
The equality operator. [...]
inherited