2015-11-06 150 views
0

我已經經歷了幾個類似的問題,但無法找到我的問題的解決方案。 我想以這種方式獲得座標點[(lat,lng),(lat,lng)..]等等所有即時通訊得到的結果是 {「pp」:[{「polygonjson」:[{} ,{},​​{},{},{}]}]}即使值正常,請查看我的代碼。獲取多個多邊形谷歌地圖API點

function getCordinates() { 
    var pp = []; 
    var item = {}; 
    item.pp = pp; 

    var currentCoordinates = ""; 
    console.log(polygons.length); 
    for (var i = 0; i < polygons.length; i++) { 
    var poly = polygons[i]; 
    var polygonsjson = {}; 
    var polygonjson = []; 
    polygonsjson.polygonjson = polygonjson; 
    for (var polyPointArray = 0; polyPointArray <poly.getPath().getArray().length; polyPointArray++) 
    { 
     polygonsjson.polygonjson.push(poly.getPath().getArray()[polyPointArray]); // the issue is in this line 
    } 
    item.pp.push(polygonsjson); 
    } 
    if (polygons.length == 0) 
    { 
    document.getElementById('<%= hdCordinates.ClientID %>').value = ""; 
    } 
    else 
    { 
    document.getElementById('<%= hdCordinates.ClientID %>').value = JSON.stringify(item); 
    } 

} 
+1

你想用座標做什麼? google.maps.LatLng對象有一個返回緯度的'.lat()'方法和一個返回經度的'.lng()'方法。 – geocodezip

+0

代碼不是很清楚,提供了更多的代碼或小提琴,以及你想要達到什麼,它是多個多邊形還是隻是一個多邊形,你想要它的頂點經緯度 –

+0

我必須將它保存在我描述的模式的數據庫中,多個多邊形 – Sana

回答

2

google.maps.LatLng對象具有.lat()方法返回的緯度和一個返回經度.lng()方法。

像這樣的東西給您回 「polygonjson」 作爲LatLngLiteral:

for (var i = 0; i < polygons.length; i++) { 
    var poly = polygons[i]; 
    var polygonsjson = {}; 
    var polygonjson = []; 
    polygonsjson.polygonjson = polygonjson; 
    for (var polyPointArray = 0; polyPointArray <poly.getPath().getArray().length; polyPointArray++) { 
    polygonsjson.polygonjson.push({lat:poly.getPath().getArray()[polyPointArray].lat(),lng:poly.getPath().getArray()[polyPointArray].lng()}); 
    } 
    item.pp.push(polygonsjson); 
} 
if (polygons.length == 0) { 
    document.getElementById('polycoords').value = ""; 
} else { 
    document.getElementById('polycoords').value = JSON.stringify(item); 
} 

proof of concept fiddle

代碼片段:

var polygons = []; 
 
var item = { 
 
    pp: [] 
 
}; 
 

 
function initialize() { 
 
    var mapOptions = { 
 
    center: new google.maps.LatLng(10, 10), 
 
    zoom: 4, 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }; 
 
    var map = new google.maps.Map(document.getElementById("map_canvas"), 
 
    mapOptions); 
 

 
    var coords2 = [ 
 
    new google.maps.LatLng(8, 10), 
 
    new google.maps.LatLng(12, 10), 
 
    new google.maps.LatLng(12, 17), 
 
    new google.maps.LatLng(8, 17), 
 
    new google.maps.LatLng(8, 10) 
 
    ]; 
 

 
    var coords3 = [ 
 
    new google.maps.LatLng(16, 12), 
 
    new google.maps.LatLng(18, 12), 
 
    new google.maps.LatLng(18, 15), 
 
    new google.maps.LatLng(16, 15), 
 
    new google.maps.LatLng(16, 12) 
 
    ]; 
 

 
    var polygon = new google.maps.Polygon({ 
 
    paths: [coords2], 
 
    strokeColor: '#FF0000', 
 
    strokeOpacity: 0.8, 
 
    strokeWeight: 1, 
 
    fillColor: '#00FF00', 
 
    fillOpacity: 0.35 
 
    }); 
 
    // alert(coords); 
 
    polygon.setMap(map); 
 
    polygons.push(polygon); 
 
    var polygon2 = new google.maps.Polygon({ 
 
    paths: [coords3], 
 
    strokeColor: '#FF0000', 
 
    strokeOpacity: 0.8, 
 
    strokeWeight: 1, 
 
    fillColor: '#00FF00', 
 
    fillOpacity: 0.35 
 
    }); 
 
    // alert(coords); 
 
    polygon2.setMap(map); 
 
    polygons.push(polygon2); 
 

 
    for (var i = 0; i < polygons.length; i++) { 
 
    var poly = polygons[i]; 
 
    var polygonsjson = {}; 
 
    var polygonjson = []; 
 
    polygonsjson.polygonjson = polygonjson; 
 
    for (var polyPointArray = 0; polyPointArray < poly.getPath().getArray().length; polyPointArray++) { 
 
     polygonsjson.polygonjson.push({ 
 
     lat: poly.getPath().getArray()[polyPointArray].lat(), 
 
     lng: poly.getPath().getArray()[polyPointArray].lng() 
 
     }); // the issue is in this line 
 
    } 
 
    item.pp.push(polygonsjson); 
 
    } 
 
    if (polygons.length == 0) { 
 
    document.getElementById('polycoords').value = ""; 
 
    } else { 
 
    document.getElementById('polycoords').value = JSON.stringify(item); 
 
    } 
 

 

 
} 
 
google.maps.event.addDomListener(window, "load", initialize);
html, 
 
body, 
 
#map_canvas { 
 
    height: 500px; 
 
    width: 500px; 
 
    margin: 0px; 
 
    padding: 0px 
 
}
<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div> 
 
<input id="polycoords" size="300" />

+0

完美地工作。正是我想要的方式。謝謝一堆 – Sana