Maplibre - adding new Polygon to Fill Layer

90 views Asked by At

I have the issue with adding new polygon to the fill layer after the map is loaded using maplibre_gl dependency. Initially when the map is loaded I add new source and new fill layer. But I have a feature when after clicking button I want to add a new Polygon to the map and associat it with the features. At the beginning after adding all of the initial polygons I call the method:

Future<void> paintPolygonWithBorder(
      Map<String, dynamic> fills, String regionName) async {
    try {
      if (mapController != null) {
        await mapController!
            .addSource(regionName, GeojsonSourceProperties(data: fills));
            
        await mapController!.addFillLayer(
            regionName, '${regionName}_fillId', fillLayerProperties);

        await mapController!.addLineLayer(
            regionName, '${regionName}_lineId', lineLayerProperties);
      }
    } catch (e) {
      print("EXCEPTION $e");
    }
  }

Then after I click the button I add new polygon to the layer

  Map<String, dynamic> fills = {
    "type": "FeatureCollection",
    "features": <Map<String, dynamic>>[]
  };
Map<String, dynamic> newFeature = {
      "type": "Feature",
      "id": featureId + 1,
      "properties": <String, dynamic>{'id': 1},
      "geometry": {
        "type": "Polygon",
        "coordinates": [coordinates],
      }
    };
    (fills["features"] as List<Map<String, dynamic>>).add(newFeature);
    mapController!.addFill(
      FillOptions(geometry: [
        [
          LatLng(northWest[0], northWest[1]),
          LatLng(northEast[0], northEast[1]),
          LatLng(southEast[0], southEast[1]),
          LatLng(southWest[0], southWest[1]),
          LatLng(northWest[0], northWest[1]),
        ]
      ], fillColor: "#ff0000", fillOpacity: 0.5, draggable: true),
    );

After that the polygon is added to the map and it is draggable. The problem is that when i click on the polygon it says it is empty in the below print statement.

void onFeatureTap(dynamic featureId, Point<double> point, LatLng latLng) {
    Map<String, dynamic>? tappedFeature = _findFeatureById(featureId);
    print("Tapped feature: $tappedFeature");}

I tried removing source with layer and adding once again before adding new polygon. This approach associates polygon with the feature and it is no longer null but I don't think it is the right approach and also the polygon is no longer draggable and I need the draggable feature.

0

There are 0 answers