flutter_map Docs
Project Links💝 Support Us
v6
v6
  • flutter_map
  • 🏗️Showcase
  • 💝Supporters
  • ✏️Credits & Contributing
  • Getting Started
    • How Does It Work?
      • Raster vs Vector Tiles
    • Demonstration
    • Installation
    • Examples
    • Migrating To v6
  • Usage
    • Base Widget
    • Options
      • Interaction Options
    • Layers
    • Programmatic Control
      • Control Camera
      • Get Camera
      • Listen To Events
    • Full API Reference
  • Layers
    • Tile Layer
      • Tile Providers
      • WMS Usage
    • Marker Layer
    • Polygon Layer
    • Polyline Layer
    • Circle Layer
    • Overlay Image Layer
    • Attribution Layer
  • Tile Servers
    • Using Mapbox
    • Using Thunderforest
    • Using Stadia Maps
    • Using Bing Maps
    • Offline Mapping
    • Other Options
  • Plugins
    • Plugins List
    • Creating A Plugin
      • Creating New Tile Providers
      • Creating New Layers
Powered by GitBook

© flutter_map Authors & Maintainers

On this page
  • Alignment
  • Rotation
  • Handling Gestures

Was this helpful?

Export as PDF
  1. Layers

Marker Layer

PreviousWMS UsageNextPolygon Layer

Last updated 1 year ago

Was this helpful?

You can add single point features - such as pins, labels, or markers - to maps using MarkerLayer and Markers.

No more image only markers! , we allow usage of any widget as the marker.

MarkerLayer(
  markers: [
    Marker(
      point: LatLng(30, 40),
      width: 80,
      height: 80,
      child: FlutterLogo(),
    ),
  ],
),

Excessive use of markers may create performance issues.

Alignment

The marker widget will be centered over the geographic coordinate by default. However, this can be changed with the alignment argument, which aligns the widget relative to the point.

The center of rotation when rotate is true will be the point.

The default alignment for all Markers within a MarkerLayer can be set by changing the same property on the MarkerLayer.

Rotation

It is possible to enable the Marker to automatically counter-rotate to the camera's rotation, to ensure it remains facing upwards, via the rotate argument.

The default alignment for all Markers within a MarkerLayer can be set by changing the same property on the MarkerLayer.

There is no built-in support to rotate markers to a specific degree. However, this is easy to implement through a rotating widget, such as Transform.rotate.

Handling Gestures

There is no built-in support to handle gestures on Markers, such as taps. However, this is easy to implement using a standard GestureDetector.

Consider using a clustering plugin to merge nearby markers together, reducing the work that needs to be done when rendering: .

Unlike other
popular mapping libraries
MarkerLayer class - flutter_map library - Dart API
Logo
Marker class - flutter_map library - Dart API
Logo
Marker Clustering
An example Marker, using FlutterLogo as the child