Skip to content

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

License

Notifications You must be signed in to change notification settings

Robert01101101/google_maps_custom_marker

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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.

Support me

This package is free, and there is no need to pay me. But if it helps you, I appreciate a coffee :)

Buy Me A Coffee

About

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

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published