google_maps_custom_marker 1.0.3 copy "google_maps_custom_marker: ^1.0.3" to clipboard
google_maps_custom_marker: ^1.0.3 copied to clipboard

A flexible package for creating various shapes of highly customizable markers with optional labels.

google_maps_custom_marker #

pub package

A flexible package for creating various shapes of highly customizable markers with optional labels.

screenshot from example

Features #

Use this package in your Flutter app to:

  • Dynamically create markers to use with google_maps_flutter
  • Add text labels to markers
  • Create circle, pin, and text bubble marker shapes
  • Customize the appearance, including options for colors, padding, shadow, and more

Getting started #

  1. Follow the instructions for getting started with google_maps_flutter
  2. Create a marker with your desired position and other properties
  3. Import this package, pass your marker to GoogleMapsCustomMarker.createCustomMarker()
  4. Configure the shape, style, and shape-specific options
  5. The returned marker has the updated icon and anchor, and is ready for use with your map

Usage #

Marker pinMarker = await GoogleMapsCustomMarker.createCustomMarker(
    marker: const Marker(
        markerId: MarkerId('pin'),
        position: LatLng(49,-123),
    ),
    shape: MarkerShape.pin,
    title: '99',
);

Marker circleMarker = await GoogleMapsCustomMarker.createCustomMarker(
    marker: const Marker(
        markerId: MarkerId('circle'),
        position: LatLng(49.01,-123),
    ),
    shape: MarkerShape.circle,
    title: '99',
);

Marker bubbleMarkerCustomized = await GoogleMapsCustomMarker.createCustomMarker(
    marker: const Marker(
        markerId: MarkerId('bubble'),
        position: LatLng(49.02,-123),
    ),
    shape: MarkerShape.bubble,
    title: 'Customize Me!',
    backgroundColor: GoogleMapsCustomMarkerColor.markerYellow.withOpacity(.8),
    foregroundColor: Colors.black,
    textSize: 38,
    enableShadow: false,
    padding: 150,
    textStyle: const TextStyle(decoration: TextDecoration.underline),
    imagePixelRatio: 1.5,
    bubbleOptions: BubbleMarkerOptions(
        anchorTriangleWidth: 32,
        anchorTriangleHeight: 48,
        cornerRadius: 12,
    ),
);

_markers.addAll([pinMarker, circleMarker, bubbleMarkerCustomized]);

Additional information #

This package was developed to help more easily create beautiful, semantic maps.

If you have suggestions for changes, additions, or would like to contribute, that is more than welcome.

11
likes
140
points
735
downloads

Publisher

verified publisherrmichels.com

Weekly Downloads

A flexible package for creating various shapes of highly customizable markers with optional labels.

Repository (GitHub)
View/report issues

Documentation

API reference

License

Apache-2.0 (license)

Dependencies

flutter, google_maps_flutter

More

Packages that depend on google_maps_custom_marker