DrawingManager poligon yolunu ayıklayın Google Maps on click

Question

Bir kullanıcının çok çizebildiği ve onu db'ye kaydedebildiği bir çizim yöneticisiyle Google haritanız var. Overlaycomplete olayı için drawingManager nesnesine bir olay dinleyicisi ekledim. Etkinlik tetiklendiğinde, çokgenin koordinatları gizli bir alana yazılır. Bu harika çalışıyor - tek sorun, bu noktadan sonra olayın kovulmadığı zaman bireysel köşe noktalarının sürüklenmesi/değiştirilmesidir. Kullanıcıya gönderdiğinde ve herhangi birini gizli alana yazdığında, (herhangi) değişiklikten sonra alanı güncellemem veya çokgen köşeleri boyunca yinelemem gerekir. Oldukça bu işe nasıl bilemiyorum, ancak şimdiye kadar burada ne var görebilirsiniz: http://jsfiddle.net/5Y4WT/21/

HTML:

<div id="map_canvas" style="width:500px; height:450px;"></div> 
<form method="post" accept-charset="utf-8" id="map_form"> 
    <input type="text" name="vertices" value="" id="vertices" /> 
    <input type="button" name="save" value="Save!" id="save" /> 
</form> 

JavaScript:

var map; // Global declaration of the map 
var iw = new google.maps.InfoWindow(); // Global declaration of the infowindow 
var lat_longs = new Array(); 
var markers = new Array(); 
var drawingManager; 
function initialize() { 
    var myLatlng = new google.maps.LatLng(40.9403762, -74.1318096); 
    var myOptions = { 
     zoom: 13, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP} 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    drawingManager = new google.maps.drawing.DrawingManager({ 
    drawingMode: google.maps.drawing.OverlayType.POLYGON, 
    drawingControl: true, 
    drawingControlOptions: { 
       position: google.maps.ControlPosition.TOP_CENTER, 
       drawingModes: [google.maps.drawing.OverlayType.POLYGON] 
       }, 
         polygonOptions: { 
          editable: true 
         } 
      }); 
      drawingManager.setMap(map); 

      google.maps.event.addListener(drawingManager, "overlaycomplete", function(event) { 
       var newShape = event.overlay; 
       newShape.type = event.type; 
      }); 

      google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) { 
       $('#vertices').val(event.overlay.getPath().getArray()); 
      }); 
     } 
initialize(); 

$(function(){ 
    $('#save').click(function(){ 
     //iterate polygon vertices? 
    }); 
}); 

Answer 1

Figür dışarı çıktı!

Ben fonksiyon overlayClickListener ekledi:

function overlayClickListener(overlay) { 
    google.maps.event.addListener(overlay, "mouseup", function(event){ 
     $('#vertices').val(overlay.getPath().getArray()); 
    }); 
} 

ve overlaycomplete üzerine bindirme bunu ekli: eylem çözüm için

google.maps.event.addListener(drawingManager, "overlaycomplete", function(event){ 
       overlayClickListener(event.overlay); 
       $('#vertices').val(event.overlay.getPath().getArray()); 
      }); 

buraya bakın: http://jsfiddle.net/rvsMH/1/