How to use the Google Maps library with Flutter Web? [closed]

Answer 1

If you need to use the library, I found this alternative:

Widget getMap() {
String htmlId = "7";

final mapOptions = new MapOptions()
  ..zoom = 8
  ..center = new LatLng(-34.397, 150.644);

// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory(htmlId, (int viewId) {
  final elem = DivElement()
    ..id = htmlId
    ..style.width = "100%"
    ..style.height = "100%"
    ..style.border = 'none';

  new GMap(elem, mapOptions);

  return elem;
});

return HtmlElementView(viewType: htmlId);
}

I didn't tested it thoroughly but it seems to render the map.

A basic working example of this solution is here:

https://github.com/dazza5000/flutter_web_google_maps_example

Created a video walk-through of the project:

https://www.youtube.com/watch?v=iW7pCBL7yWk

Barebones blog article walking through solution:

http://whereisdarran.com/2020/01/google-maps-for-flutter-web/