javascript - delete node from a user created google maps polyline -


i need allow users create polylines on google map , allow them delete node between polylines created. result of removal should new polyline connecting 2 new neighboring nodes. @ moment i'm struggling allowing user delete node. i've researched bit , found a google reference , this question. unfortunately, both of them assume have reference polyline somewhere, don't, since polyline being created dynamically user.

this code use :

function initialize() {     var mapoptions = {         center: { lat: 45.797436, lng: 24.152044 },         zoom: 12     };     var map = new google.maps.map(document.getelementbyid('map-canvas'),         mapoptions);      var drawingmanager = new google.maps.drawing.drawingmanager({         drawingmode: google.maps.drawing.overlaytype.marker,         drawingcontrol: true,         drawingcontroloptions: {             position: google.maps.controlposition.top_center,             drawingmodes: [                 google.maps.drawing.overlaytype.marker,                 google.maps.drawing.overlaytype.polyline             ]         },         markeroptions: {             icon: '/mvc/content/styles/dropdownarrow.png'         },         polylineoptions: {             editable: true,         }     });     drawingmanager.setmap(map);      google.maps.event.addlistener(drawingmanager, 'markercomplete', markercompleted);     google.maps.event.addlistener(drawingmanager, 'polylinecomplete', polylinecompleted);      function markercompleted(marker) {         var coordinates = { lng: marker.getposition().lng(), lat: marker.getposition().lat() };         alert('the coordinates new marker are: lat:' + coordinates.lat + ', long: ' + coordinates.lng);     }      function polylinecompleted(polyline) {      } }  google.maps.event.adddomlistener(window, 'load', initialize); 

what i've tried map polyline parameter inside polylinecompleted event handler global variable, , use solution found in link somehow update polyline, after which, using getmap() , setmap() functions of drawingmanager class, update map, got stuck. there way of allowing user delete polyline node, without having reference polyline object?

not sure trying achieve, here example on how let user add , remove nodes polyline without using drawingmanager.

var map, polyline, markers = new array();  function initialize() {      var mapoptions = {         zoom: 6,         center: new google.maps.latlng(20.291, 153.027),         maptypeid: google.maps.maptypeid.terrain     };      map = new google.maps.map(document.getelementbyid('map-canvas'),     mapoptions);      polyline = new google.maps.polyline({         strokecolor: 'red',         strokeweight: 1,         map: map     });      google.maps.event.addlistener(map, 'click', function (event) {          addpoint(event.latlng);     }); }  function removepoint(marker) {      (var = 0; < markers.length; i++) {          if (markers[i] === marker) {              markers[i].setmap(null);             markers.splice(i, 1);              polyline.getpath().removeat(i);         }     } }  function addpoint(latlng) {      var marker = new google.maps.marker({         position: latlng,         map: map     });      markers.push(marker);      polyline.getpath().setat(markers.length - 1, latlng);      google.maps.event.addlistener(marker, 'click', function (event) {          removepoint(marker);     }); }  initialize(); 

jsfiddle demo

click on map add point , click on marker remove point.


Comments

Popular posts from this blog

How has firefox/gecko HTML+CSS rendering changed in version 38? -

javascript - Complex json ng-repeat -

jquery - Cloning of rows and columns from the old table into the new with colSpan and rowSpan -