Bitmap generator for Google Map custom marker. Supports network image and caching.

sample screen shot


Creating custom marker on Google Maps for flutter is little complicated.

  • You have to provide the bitmap of your target object
  • You have to resize and position in right way if you use the image
  • Generating the marker bitmap costs a lot of machine resource so you have to cache the bitmap

This package solves these problems and let you generate the beautiful marker with small code.

Supported marker shapes

  • circle avatar

More shapes will be added in the future.


This package does not contain Google maps for flutter plugin. Install it by yourself.


You can get the bitmap by passing the url of image and call generator methods.

// create the instance of CachedNetworkMarker
final generator = CachedNetworkMarker(
  url: 'YOUR_IMAGE_URL',
  dpr: MediaQuery.of(context).devicePixelRatio,

// generate bitmap
final bitmap = await generator.circleAvatar(CircleAvatarParams(color: Colors.lightBlue));

// create marker with generated bitmap
final marker = Marker(
  markerId: MarkerId('0'),
  position: LatLng(37.42596133580664, -122.083749655962),
  icon: BitmapDescriptor.fromBytes(bitmap),

For more detailed usage, see example project