flutter-maplibre-gl icon indicating copy to clipboard operation
flutter-maplibre-gl copied to clipboard

[BUG] onMapClick not fired when tapping SymbolLayer

Open nijs9 opened this issue 5 months ago • 1 comments

Platforms

Android en iOS

Version of flutter maplibre_gl

0.20

Bug Description

I am adding a vector source to the map. After that, I add a SymbolLayer. Then, in the onMapClick event, I use the queryRenderedFeaturesInRect function to query all features that I click on. This function works fine when I click on the base map, but when I click on a symbol from my self-added vector layer, the onMapClick event is not triggered. When I retrieve the style IDs for the current style, it’s clear that my own SymbolLayer has been correctly added and exists.

Steps to Reproduce

  1. Add a vector source.
  2. Add a symbol layer based on this vector source.
  3. Implement queryRenderedFeaturesInRect in onMapClick.
  4. Click on map.
  5. When clicking outside the self added layer, onMapClick is fired.
  6. When clicking on a feature of the custom vector source, onMapClick is not fired.

Expected Results

Getting my own added features after onMapClick and queryRenderedFeaturesInRect.

Actual Results

Only features from basemap are triggering onMapClick. When clicking on a feature of the custom vector source, onMapClick is not fired.

Code Sample

Adding vector source:

await mapController.addSource(
      'custom-nodes',
      VectorSourceProperties(
        tiles: [
          'https://xxxx.com/$flavor/nodes/{z}/{x}/{y}.pbf'
        ],
        maxzoom: 18,
      ),
    );

Add layer:

await mapController.addSymbolLayer(
        'custom-nodes',
        'custom-nodes-signed',
        SymbolLayerProperties(
          iconImage: 'node-image-signed',
          iconSize: [
            Expressions.interpolate,
            ["linear"],
            [Expressions.zoom],
            10,
            0.52,
            12,
            0.64,
            13,
            0.70,
            15,
            0.72
          ],
          textAllowOverlap: false,
          iconAllowOverlap: true,
          iconIgnorePlacement: true,
          textField: ['get', 'label'],
          textColor: RPColors.colorNodes,
          textOpacity: 1.0,
          textSize: [
            Expressions.interpolate,
            ["linear"],
            [Expressions.zoom],
            10,
            8,
            12,
            9,
            13,
            10,
            15,
            11
          ],
          textAnchor: 'center',
          textJustify: 'center',
          visibility: 'visible',
          textFont: ['Noto Sans Bold', 'Open Sans Bold'],
        ),
        sourceLayer: 'nodes_data_$flavor',
        minzoom: 11,
        filter: [
          'all',
          ['!=', 'label', 'SP'],
          ['!=', 'label', 'TP'],
          ['!=', 'onlylf', 1],
          ['==', 'signed', 1]
        ]);

onMapClick:

void _onMapClick(Point<double> point, LatLng coordinates) async {

    final features = await mapController.queryRenderedFeaturesInRect(
      Rect.fromCenter(
        center: Offset(point.x, point.y), 
        width: 50, 
        height: 50,
      ),
      [
        'custom-nodes-signed',
      ],
      null,
    );

    if (features.isNotEmpty) {
      for (final feature in features) {
        print("Feature found: ${feature.id}");
      }
    } else {
      print("No Features Found");
    }
  }

nijs9 avatar Sep 20 '24 08:09 nijs9