1
私は形状が作成されたときのために、このイベントリスナーがあります。しかし、.getPathsは()に関係なく、どのように多くの行の私の、緯度/経度の唯一のセットを返すように見えるGoogle Maps API描画ポリゴン - オーバーレイコンプリートイベントは、1セットの座標しか返しません。
// This example requires the Drawing library. Include the libraries=drawing
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=drawing">
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -33.872, lng: 151.252},
zoom: 6
});
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.POLYGON,
drawingControl: false,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_LEFT,
drawingModes: []
},
polygonOptions: {
fillColor: 'rgba(255, 0, 0, 0.2)',
fillOpacity: 1,
strokeWeight: 2,
clickable: true,
editable: true,
zIndex: 1
}
});
drawingManager.setMap(map);
// Define the LatLng coordinates for the outer path.
var outerCoords = [
{lat: -25.364, lng: 155.207}, // north west
{lat: -35.364, lng: 155.207}, // south west
{lat: -35.364, lng: 148.207}, // south east
{lat: -25.364, lng: 148.207} // north east
];
map.data.add({geometry: new google.maps.Data.Polygon([outerCoords])});
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
if(event.type == 'polygon') {
var verticles = event.overlay.getPaths();
verticles.forEach(function(verticle, ind){
console.log({
"index": ind,
"lat": verticle.getAt(ind).lat(),
"lng": verticle.getAt(ind).lng(),
"obj": verticle.getAt(ind)
});
});
}
});
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<div id="capture"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBFOolEMjIlnlkVle8gsiDA1ym3aktxEGc&libraries=drawing&callback=initMap"
async defer></script>
</body>
</html>
をポリゴンは次のもので構成されます。ドキュメントからは、オブジェクトの配列を返すように見えました。各オブジェクトは、線を描画するのに必要な2点(lat/lng)の配列です。私は何が欠けていますか?このため