如何使用Google Maps API捕获Polygon的点位置?

时间:2013-09-24 01:33:42

标签: javascript google-maps google-maps-api-3

使用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()函数来显示构成绘制的多边形的坐标?

1 个答案:

答案 0 :(得分:16)

在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-method)并使用LatLng的字符串表示填充另一个数组