Style Google Maps in Flutter silver or black & white

Issue

I’m using Google Maps in a Flutter app. I’m looking for a way to style the map on a black and white edition. I’ve seen this done in web editions, but not sure if it’s possible in the Flutter edition…yet.
Wonder if anyone else has achieved this and how?

Solution

First you have to get a style.json from: https://mapstyle.withgoogle.com/ and add it to your assets.

  assets:
    - assets/json_assets/

Then you add this to your init State where the google Maps widget is

  @override
  void initState() {
    super.initState();
    rootBundle.loadString('assets/json_assets/map_style.txt').then((string) {
      _mapStyle = string;
    });
  }

and last but not least your Map Created function should look like this:

  void _onMapCreated(GoogleMapController controller) {
    controller.setMapStyle(_mapStyle);
    _mapController = controller;
    initMemoryClustering();
  }

Answered By – Markus Hein

Answer Checked By – Marilyn (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *