[英]how to get the newly edited polygon coordinates in google map apiv3
我已成功創建和編輯多邊形,繪制多邊形后,我得到多邊形的坐標,我正在尋找的是在編輯多邊形之后,我沒有得到多邊形的新坐標(在拖動結束后我得到坐標,當我繪制多邊形時,新坐標應立即出現)。
我的java腳本:
var map;
var coords = [];
var lats = [];
var lngs = [];
var myMarkers = [];
var myPoly;
function initialize() {
var latlng = new google.maps.LatLng(17.397821, 78.479354);
var mapOptions = {
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.TERRAIN
}
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
addEventListener_marker();
}
function addEventListener_marker() {
google.maps.event.addListener(map, 'click', function (e) {
coords.push(e.latLng);
lats.push(e.latLng.lb);
lngs.push(e.latLng.mb);
placeMarker(e.latLng, map);
});
}
function placeMarker(position, map) {
var mark = new google.maps.Marker({
position: position,
map: map,
draggable: false
});
myMarkers.push(mark);
}
function createPoly() {
polyOptions = {
path: coords,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF6803",
fillOpacity: '0.25',
draggable: true,
editable: true
}
myPoly = new google.maps.Polygon(polyOptions);
myPoly.setMap(map);
google.maps.event.addListener(myPoly, 'click', isWithinPoly);
markerCoords();
//removeEventListener();
clearOverlays();
}
function markerCoords() {
var curLatLng = [];
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
//google.maps.event.addListener(myPoly, 'shape_changed', function () {
google.maps.event.addListener(myPoly, 'dragend', function () {
//alert("drag end");
var curLatLng;
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
});
google.maps.event.addListener(myPoly, 'set_at', function () {
//alert("drag end");
var curLatLng1;
curLatLng1 = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng1 + "<br/>");
});
google.maps.event.addListener(myPoly, 'insert_at', function () {
//alert("drag end");
var curLatLng2;
curLatLng2 = myPoly.getPath().getLength();
$("#info").append("coordinates are: Latitude: " + curLatLng2 + "<br/>");
});
}
function removeEventListener() {
//google.maps.event.clearListeners(map, 'bounds_changed');
}
function clearOverlays() {
setAllMap(null);
}
function setAllMap(map) {
for (var i = 0; i < myMarkers.length; i++) {
myMarkers[i].setMap(map);
}
}
function isWithinPoly(event) {
var isWithinPolygon = google.maps.geometry.poly.containsLocation(event.latLng, this);
}
google.maps.event.addDomListener(window, 'load', initialize);
和HTML是:
<div id="map-canvas"></div>
<p id="info"></p>
<input type="button" onclick="createPoly();" value="draw polygon" />
編輯:
我正在使用set_at和其他兩個這樣但三個事件都沒有被觸發。
function markerCoords() {
var curLatLng = [];
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
//google.maps.event.addListener(myPoly, 'shape_changed', function () {
google.maps.event.addListener(myPoly, 'dragend', function () {
alert("drag end");
var curLatLng;
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
});
google.maps.event.addListener(myPoly, 'set_at', function () {
alert("set_at");
var curLatLng;
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
});
google.maps.event.addListener(myPoly, 'insert_at', function () {
alert("insert_at");
var curLatLng;
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
});
google.maps.event.addListener(myPoly, 'remove_at', function () {
alert("remove_at");
var curLatLng;
curLatLng = myPoly.getPath().getArray();
$("#info").append("coordinates are: Latitude: " + curLatLng + "<br/>");
});
}
觀察多邊形路徑的事件set_at
, insert_at
和remove_at
:
google.maps.event.addListener(myPoly.getPath(), 'set_at', markerCoords);
google.maps.event.addListener(myPoly.getPath(), 'insert_at',markerCoords);
google.maps.event.addListener(myPoly.getPath(), 'remove_at',markerCoords);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.