All pages
Powered by GitBook
1 of 2

Loading...

Loading...

Options

To dictate & restrict what the map can and should do, regardless of its contents, it needs some guidance!

It provides options that can be categorized into three main parts:

  • Initial positioning Defines the location of the map when it is first loaded

  • Permanent rules Defines restrictions that last throughout the map's lifetime

  • Defines methods that are called on specific map events

One part of MapOptions responsibilities is to define how the map should be positioned when first loaded. There's two ways to do this (that are incompatible):

  • initialCenter (LatLng) & initialZoom

  • initialCameraFit

It is possible to also set the map's initialRotation in degrees, if you don't want it North (0°) facing initially.

If rotation is enabled/allowed, if using initialCameraFit, prefer defining it by coordinates for a more intended/tight fit.

One part of MapOptions responsibilities is to define the restrictions and limitations of the map and what users can/cannot do with it.

Some of the options are described elsewhere in this documentation, in context. In addition, the API docs show all the available options, and below is a partial list of options:

  • cameraConstraint

    • camera bounds inside bounds: CameraConstraint.bounds

    • camera center inside bounds: CameraConstraint.center

Interaction Options

The InteractionOptions object passed to MapOptions.interactiveOptions configures the gestures that the user can use to interact with the map. For example, disable rotation or configure cursor/keyboard rotation.

Flags

flags is a bitfield that enables and disables the vast majority of gestures. Although technically the type is of int, it is usually set with a combination of InteractiveFlags.

Note that some gestures must be configured by other means, either instead of using flags, or in addition to.

By default, all gestures are enabled, but a non-interactive map can be created using none (and other options in addition).

The recommended way to create an entirely non-interactive map is to wrap the FlutterMap widget in an IgnorePointer widget.

Otherwise, to set flags, there's two methods:

  • Add flags, with the bitwise 'OR' (|) operator in-between For example, InteractiveFlag.drag | InteractiveFlag.rotate

  • Remove flags from all, using the & and ~ operators in-between For example, InteractiveFlag.all & ~InteractiveFlag.rotate

Cursor/Keyboard Rotation

Cursor/keyboard rotation is designed for desktop platforms, and allows the cursor to be used to set the rotation of the map whilst a (customizable) keyboard key (by default, any of the 'Control' keys) is held down.

The CursorKeyboardRotationOptions object passed to the property with the corresponding name configures this behaviour. The CursorKeyboardRotationOptions.disabled() constructor can be used to disable cursor/keyboard rotation.

There's many customization options, see the API docs for more information:

"Win" Gestures

This is advanced behaviour that affects how gestures 'win' in the gesture arena, and does not usually need changing.

by bounds (circumscribed): CameraFit.bounds
  • by bounds (inscribed): CameraFit.insideBounds

  • by coordinates (circumscribed): CameraFit.coordinates

  • unconstrained (default): CameraConstraint.unconstrained

  • maxZoom and minZoom Sets a hard limit on the maximum and minimum amounts that the map can be zoomed

  • Configures the gestures that the user can use to interact with the map - for example, disable rotation or configure cursor/keyboard rotation

  • Initial Positioning

    Changing these properties after the map has already been built for the first time will have no effect: they only apply on initialisation.

    To control the map programatically, use a MapController: .

    Permanent Rules

    Instead of maxZoom (or in addition to), consider setting maxNativeZoom per TileLayer instead, to allow tiles to scale (and lose quality) on the final zoom level, instead of setting a hard limit.

    Event handling
    interactionOptions
    Control Camera
    CursorKeyboardRotationOptions class - flutter_map library - Dart APIpub.dev
    Logo
    InteractionOptions class - flutter_map library - Dart APIpub.dev
    Logo
    InteractiveFlag class - flutter_map library - Dart APIpub.dev
    Logo
    MapOptions class - flutter_map library - Dart APIpub.dev
    Logo