flutter_map Docs
Project Links💝 Support Us
v7
v7
  • flutter_map
  • 🏗️Why Choose flutter_map?
  • 💝Supporters
  • ✏️Credits & Contributing
  • Getting Started
    • How Does It Work?
      • Raster vs Vector Tiles
    • Installation
    • Examples
    • v7 Information
  • Usage
    • Base Widget
    • Options
      • Interaction Options
      • Custom CRSs
    • Layers
    • Programmatic Interaction
      • Controllers & Cameras
      • External Custom Controllers
      • 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
    • Layer Interactivity
      • Hit Testing Behaviour
  • Tile Servers
    • Using Google Maps
    • Using Mapbox
    • Using Thunderforest
    • Using Tracestrack
    • Using Stadia Maps
    • Using Lima Labs
    • 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
LogoMarkerLayer class - flutter_map library - Dart API
LogoMarker class - flutter_map library - Dart API
Marker Clustering
An example Marker, using FlutterLogo as the child