Can't add marker to Google Maps Flutter

832

I fixed it by putting variable inside Marker List.

void _onMapCreated(GoogleMapController controller) async {
final Uint8List customMarker = await getBytesFromAsset(
    path: ('assets/images/golmarker.png'), width: 200);
mapMarker = BitmapDescriptor.fromBytes(customMarker);
setState(() {
  _markers.add(
    Marker(
        markerId: MarkerId('1'),
        icon: mapMarker!,
        position: LatLng(41.566743, 36.093695),
        infoWindow: InfoWindow(
            title: 'Uzun Göl',
            snippet: 'Kızılırmak Deltasındaki Acı Göller İçerisindedir.')),
  );
  _controller.complete(controller);
});
Share:
832
CidQu
Author by

CidQu

Updated on January 03, 2023

Comments

  • CidQu
    CidQu over 1 year

    I'm trying to add a marker to Flutter Google but couldn't manage to add an icon to it. I'm sharing the code, the error that I'm getting is, "mapMarker" couldn't be null.

    It actually works without 'Uint8List' but the icon is too big, so I need to resize it. Adding small assets is not an option because quality is getting worse.

    I'm running this code:

    class _Harita extends State<Harita> {
      Completer<GoogleMapController> _controller = Completer();
      Set<Marker> _markers = {};
      BitmapDescriptor? mapMarker;
      BitmapDescriptor? mapMarker1;
    
    
      void initState() {
        setCustomMarker();
        super.initState();
      }
    
      static final CameraPosition _kGooglePlex = CameraPosition(
        target: LatLng(41.6018963, 36.0805428),
        zoom: 12.06,
      );
    
      Future<Uint8List> getBytesFromAsset(
          {required String path, required int width}) async {
        ByteData data = await rootBundle.load(path);
        ui.Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List(),
            targetWidth: width);
        ui.FrameInfo fi = await codec.getNextFrame();
        return (await fi.image.toByteData(format: ui.ImageByteFormat.png))!
            .buffer
            .asUint8List();
      }
    
      void setCustomMarker() async {
        final Uint8List customMarker = await getBytesFromAsset(
            path: ('assets/images/golmarker.png'), width: 200);
    
        setState(() {
          mapMarker = BitmapDescriptor.fromBytes(customMarker);
        });
      }
    
      void _onMapCreated(GoogleMapController controller) {
        sleep(Duration(seconds: 5));
        setState(() {
          _markers.add(
            Marker(
                markerId: MarkerId('1'),
                icon: mapMarker!,
                position: LatLng(41.566743, 36.093695),
                infoWindow: InfoWindow(
                    title: 'Uzun Göl',
                    snippet: 'Kızılırmak Deltasındaki Acı Göller İçerisindedir.')),
          );
          _controller.complete(controller);
        });
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            body: Stack(
              children: <Widget>[
                GoogleMap(
                  markers: _markers,
                  onMapCreated: _onMapCreated,
                  mapType: MapType.normal,
                  initialCameraPosition: _kGooglePlex,
                  /*onMapCreated: (GoogleMapController controller) {
                    _controller.complete(controller);
                  },*/
                ),
                Positioned(
                  top: 60,
                  left: 20,
                  child: InkWell(
                    child: Container(
                      height: 40,
                      width: 40,
                      decoration: BoxDecoration(
                          color: Colors.white, shape: BoxShape.circle),
                      child: Icon(
                        Icons.close,
                        size: 25,
                      ),
                    ),
                    onTap: () {
                      Navigator.pop(context);
                    },
                  ),
                ),
              ],
            ),
            floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
            floatingActionButton: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  FloatingActionButton.extended(
                      backgroundColor: Color.fromRGBO(74, 112, 217, 2),
                      heroTag: "qrcodefalanbruh",
                      onPressed: () {
                        Navigator.pushReplacement(
                            context,
                            MaterialPageRoute(
                                builder: (BuildContext context) => super.widget));
                      },
                      icon: Icon(Icons.location_searching, color: Colors.white),
                      label:
                          Text('Ortalama', style: TextStyle(color: Colors.white))),
                ],
              ),
            ));
      }
    }