2

How can I delete a vertex (polygon point) on the data layer of google maps loaded with loadGeoJson?

http://output.jsbin.com/tuyived

I want to delete a single vertex by right-clicking the white circle (for example, the top-left corner of the L from googLe)

  • Actually I want to achieve this https://developers.google.com/maps/documentation/javascript/examples/delete-vertex-menu on the DataLayer https://developers.google.com/maps/documentation/javascript/datalayer#overview – vlad.pitaru Jun 28 '16 at 15:17

1 Answers1

10

you can remove all with the following snippet:

map.data.forEach(function(feature) {
    //If you want, check here for some constraints.
    map.data.remove(feature);
});

Reference: Remove all features from data layer

Edit:

If you want to remove just the clicked vertex it is a bit more tricky, but i could be done by the following click handler:

map.data.addListener('click', function(ev) {

    //array to hold all LatLng in the new polygon, except the clicked one
    var newPolyPoints = [];

    //iterating over LatLng in features geometry
    ev.feature.getGeometry().forEachLatLng(function(latlng) {

        //excluding the clicked one
        if (latlng.lat() == ev.latLng.lat() && latlng.lng() == ev.latLng.lng()) {
            console.log('This one will be removed: lat: ' + latlng.lat() + ', lng: ' + latlng.lng());
        } else {
            //keeping not matching LatLng
            newPolyPoints.push(latlng);
        }
    });

    //creating new linear ring
    var newLinearRing = new google.maps.Data.LinearRing(newPolyPoints);

    //creating a new polygon out of the new linear ring
    var newPoly = new google.maps.Data.Polygon([newLinearRing]);

    //apply the new polygon to the clicked feature
    ev.feature.setGeometry(newPoly);
});

You may need to adjust it according to your needs / your data structure. It works for the provided structure.

Hope this time it help ;)

Community
  • 1
  • 1
Martin Ackermann
  • 884
  • 6
  • 15