javascript - 如何使用 Google Maps API 捕获多边形的点位置？

Question

使用 Google Maps API 绘图管理器，我想收集用户绘制的多边形中每个点的位置。

我知道有一个 getPath() 函数，但我不确定我在哪里使用它。

这是我目前所有的代码:

var map; var drawingManager;

function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng(45.13536, -100.762952),
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    drawingManager = new google.maps.drawing.DrawingManager({
        drawingMode: google.maps.drawing.OverlayType.POLYGON,
        drawingControl: false,
        polygonOptions: {
            fillColor: "#000000",
            fillOpacity: .6,
            strokeWeight: 1,
            strokeColor: "#666666",
            clickable: false,
            editable: true,
            zIndex: 1
        }
    });

    drawingManager.setMap(map);

    google.maps.event.addListener(drawingManager, 'polygoncomplete', function(polygon) {
        drawingManager.setDrawingMode(null);
    });
}

google.maps.event.addDomListener(window, 'load', initialize);

那么从这段代码中，我如何使用 getPath() 函数来显示构成绘制的多边形的坐标？

Answer 1

在 polygoncomplete-callback 中使用它。

例子:

 google.maps.event.addListener(drawingManager, 'polygoncomplete', function(polygon) {
    drawingManager.setDrawingMode(null);
    var arr=[];
    polygon.getPath().forEach(function(latLng){arr.push(latLng.toString());})
    alert(arr.join(',\n'));
});

它遍历路径(使用 google.maps.MVCArray 的 forEach 方法)并使用 LatLng 的字符串表示填充另一个数组