Google Maps Plugin - Marker icon has incorrect size on iOS

1,151 views
Skip to first unread message

Ian Evans

unread,
Jan 31, 2019, 4:09:08 PM1/31/19
to Flutter Dev
The Google Maps Flutter plugin does not support resolution-aware image assets when specifying marker icons i.e.: 

.../marker_icon.png
.../2.0x/marker_icon.png
.../3.0x/marker_icon.png

The plugin requires that you use BitmapDescriptor.fromAsset('<path>/marker_icon.png') which does not resolve to the correct image. As a workaround I am using the following approach to get the correct image and then pass it to the BitmapDescriptor:

ImageConfiguration config = createLocalImageConfiguration(buildContext);
AssetImage('<path>/marker_image.png')
   .obtainKey(config)
   .then((resolvedMarkerImage) {
       markerIcon = BitmapDescriptor.fromAsset(resolvedIMarkerImage.name));
    });

This works on Android. The AssetImage chooses the correct image according to the pixel ratio of the device and the maps plugin displays the marker at the expected size. However on iOS the image is not sized as per the asset, the image is getting enlarged. 

My guess is that on iOS the image is being scaled up according to pixel ratio of the device, despite the fact I have already given an asset of the desired size. Perhaps it's the way the maps plugin creates an UIImage on iOS? Has anybody else seen this? Are there any known solutions/workarounds?

Steven McDowall

unread,
Jan 31, 2019, 4:15:38 PM1/31/19
to Ian Evans, Flutter Dev

This seems like a better thing to post as an Issue in the plugins github area? 



--
You received this message because you are subscribed to the Google Groups "Flutter Dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Sam Toon

unread,
Feb 2, 2019, 11:46:36 AM2/2/19
to Flutter Dev
This is being discussed on GitHub - https://github.com/flutter/flutter/issues/24865

I found that to get iOS to work you need to list the @2x and @3x variants of the images in the assets section of pubspec.yaml - they then get copied into the ios build folder and ios automatically uses them.

I had a bit of a hack to get android to work, but your way might be better.

Ian Evans

unread,
Feb 2, 2019, 3:44:24 PM2/2/19
to Flutter Dev
Thanks Sam. Creating variants of the assets for iOS and allowing it to find them, like you said, did the trick. 
Reply all
Reply to author
Forward
0 new messages