Tap on Marker on Layer?

[attex]

Hey there,

I created a custom dataset using the Mapbox studio, converted it into a tileset, and added an additional layer to a custom style in my map.

MapWidget(
        mapOptions: MapOptions(
          pixelRatio: 1,
          orientation: NorthOrientation.UPWARDS,
        ),
        styleUri: 'mapbox://styles/xyz/xxxxxxxxxx',
      )

My Code just looks like this. Is there a way to get data from the markers I click inside a flutter app? Currently, I cannot click any markers inside my Android Flutter App.

Thank!

[fufylev]

Here is my solution:

  late MapboxMap mapboxMap;
  PointAnnotationManager? manager;

void onPointAnnotationClick(String id) {
    if (id != MapTextConstants.mapCurrentPositionDot) {
      showVenueShortBottomSheet(id);
    }
  }

This function set the points and asign to each an ID

void _usePointAnnotationManager(
  PointAnnotationManager pointAnnotationManager,
  List<PlaceEntity> places, [
  Point? point,
]) async {
  List<PointAnnotationOptions> options = [];

  final ByteData bytes = await rootBundle.load('assets/images/place_map_marker.png');
  final Uint8List image = bytes.buffer.asUint8List();

  for (var i = 0; i < places.length; i++) {
    final place = places[i];
    final key = place.id;

    if (placesMap.containsKey(key)) {
      placesMap.update(key, (_) => place);
    } else {
      placesMap.putIfAbsent(key, () => place);

      options.add(
        PointAnnotationOptions(
          geometry: Point(coordinates: Position(place.longitude, place.latitude)),
          image: image,
          textField: place.id,
          textColor: 0x00000000,
          iconSize: 0.6,
        ),
      );
    }
  }

  pointAnnotationManager.createMulti(options);
}

Here I set which manager to use and AnnotationClickListener

  void _setMarkers(List<PlaceEntity> places, [Point? point]) async {

    if (manager != null) {
      _usePointAnnotationManager(manager!, places, point ?? currentPoint);
    } else {
      mapboxMap.annotations
          .createPointAnnotationManager(id: DateTime.now().toString())
          .then((PointAnnotationManager pointAnnotationManager) async {
        setState(() => manager = pointAnnotationManager);
        
        // HERE is the code to catch tap
        pointAnnotationManager.addOnPointAnnotationClickListener(
            AnnotationClickListener(onPointAnnotationClickCallback: (String id) => onPointAnnotationClick(id)));
            
        _usePointAnnotationManager(pointAnnotationManager, places, currentPoint);
      });
    }
  }

Hope it will help your