Search code examples
flutterdartvisual-studio-codemaps

Flutter Google maps not displaying markers with labels after initialization


I have this code below that's straight forward. I am initializing it and setting it up the right way. When ever I run this code, the map does load, but the marker with label does not load. However, if I hot reload my code after the map loads, it instantly appear. So, what I was thinking is that it is taking a little time to load the marker label so I put it into an asyn label and did not work. This also happens if I draw the label using the original painter way.

class mappy extends StatefulWidget {
  const mappy({Key? key});

  @override
  State<mappy> createState() => sst();
}

class sst extends State<mappy> {
  late GoogleMapController mapController;
  late Set<Marker> _markers;
  final Set<Marker> _zipCodeMarkers = {};
  final LatLng _center = const LatLng(42.3314, -83.0458);
  static const MarkerId markerId = MarkerId('Detroit');

  @override
  void initState() {
    super.initState();
    _initZipCodeMarkers(); // Initialize zip code markers
  }

  void _onMapCreated(GoogleMapController controller) {
    mapController = controller;
  }

   void _initZipCodeMarkers()  {
    _zipCodeMarkers.addLabelMarker(LabelMarker(
      label: 'Static Marker',
      markerId: MarkerId('static_marker'),
      position: LatLng(42.411740, -83.058110),
      backgroundColor: Colors.blue,
      textStyle: TextStyle(
        fontSize: 45, // Adjust the font size as needed
        fontWeight: FontWeight.bold, // Adjust the font weight as needed
        color: Colors.white, // Adjust the text color as needed
      ),
    ));
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.green,
        useMaterial3: true,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Detroit'),
          backgroundColor: Colors.green[700],
        ),
        body: GoogleMap(
          myLocationEnabled: true,
          myLocationButtonEnabled: true,
          compassEnabled: true,
          onMapCreated: _onMapCreated,
          initialCameraPosition: CameraPosition(
            target: _center,
            zoom: 11.5,
          ),
          markers: _zipCodeMarkers,
        ),
      ),
    );
  }
}

Solution

  • Did you use label_marker 1.0.1 package? I checked the label_marker 1.0.1 package and it doesn't work. Then I tried something newer, for example, label_google_maps_marker 0.0.3, it works great.