2

I am using google_maps_flutter to display polygons on google maps. Every time the user taps on the map, a point is added to a list of points, that is fed to my method that creates a polygon. I also have a delete button that clears my points list and therefore my polygon based on those points clears as well (ON ANDROID ONLY).

Below are segments of my code that I think are related to the problem:

List<LatLng> polygonCoords = [LatLng(0, 0), LatLng(0, 0)]; // this list holds the points that  // form my polygon

void _setCoords(latlong) {  // latlong are the coordinats received from the user tap on the map
    setState(() {
      LatLng coords = latlong;
      if (polygonCoords.lastIndexOf(zero) == 1) {  // where zero = LatLng(0,0)
        polygonCoords.removeWhere((element) => element == zero);
        polygonCoords.add(coords);
        polygonCoords.add(coords); // first coordinate is added twice because the polygon needs // to loop back to the first point to close
      } else {
        polygonCoords.removeLast();
        polygonCoords.add(coords);
      }
    });
  }

Set<Polygon> myPolygon() {
    Set<Polygon> polygonSet = new Set();
    polygonSet.add(Polygon(
      fillColor: Colors.white,
      polygonId: PolygonId('polygonId'),
      points: polygonCoords,
      strokeWidth: 3,
      strokeColor: Colors.white,
    ));
    return polygonSet;
  }

GoogleMap(
   polygons: myPolygon(), // here I give the polygon set to my map
   mapType: MapType.satellite,
   initialCameraPosition: CameraPosition(
                      target: snapshot.data,
                      zoom: 16.0,
                    ),
   onMapCreated: _onMapCreated,
   onTap: (latlong) {
      _setCoords(latlong); // calling the method above to add the coordinates to my list
   },
);

void deleteSelection() {
    setState(() {
      polygonCoords.clear();
      polygonCoords.add(zero);
      polygonCoords.add(zero);
    });
  }

What happens on iOS is the following: I add 4 points on the map. I press the delete button and nothing happens (I checked the logs, the list does clear). I put another point on the map, the previous polygon is still showing, then I add another point, nothing changes again. When I add a 3rd point, then the old polygon disappears and the new one is rendered in my UI.

I tried calling myPolygon() inside the deleteSelection() method, I tried declaring the set outside the method, I tried clearing the set. Nothing changes, on Android it works as expected, but on iOS even though I checked and the polygon does have the new coordinates, it still won't show it until there are 3 points.

I have a solution for now which is to set the visible property of the polygon to false when there are less than 3 points in my set (visible: polygonCoords.length < 3 ? false : true), but I would like to know why the above methods don't work on iOS, and why on Android it shows those first 2 points that create a line.

Using google_maps_flutter: ^1.1.0

Dan Crisan
  • 137
  • 7

1 Answers1

0

I have handled it with some logic.

If your latlng points list size is less than 3 then make polylines, else add points list in polygons.

And add both polylines and polygons in google map. GoogleMap( polygons: _con!.polygons, polylines: _con!.polylines, )

Talha Bukhari
  • 1
  • 1