0
我想绘制使用JSON数组的多个多边形。这是我目前的代码。如何绘制基于JSON数组的多个多边形
<script type="text/javascript">
var map;
var drawingManager;
var elements;
//Overlays
var polygons = [];
var polylines = [];
//JSON String turned into array
var newPolygons = '<%=request.getAttribute("polygons")%>';
var editedPolygons = JSON.parse(newPolygons);
function initialize() {
//Map
var mapProp = {
center: new google.maps.LatLng(14.5667, 120.9927),
zoom: 18,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
//Drawing Manager
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.POLYGON,
google.maps.drawing.OverlayType.POLYLINE
]
}
});
drawingManager.setMap(map);
//Triggers
google.maps.event.addDomListener(drawingManager, 'polygoncomplete', function (polygon) {
drawingManager.setDrawingMode(null);
var polypath = polygon.getPath().getArray();
polygons.push(polypath);
});
//Create the Polygons
var bermudaTriangle = new google.maps.Polygon({
paths: editedPolygons,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 3,
fillColor: '#FF0000',
fillOpacity: 0.35
});
}
//Sends to Servlet
function sendElements() {
var elementsJSON = JSON.stringify(polygons);
window.location.assign("LoadNextPage?polygons=" + elementsJSON);
}
</script>
我用一个servlet发送elementsJSON到另一个页面，我编辑它，然后我送它回到主界面通过另一个servlet并把它放回使用JSON.parse数组。但是无论我做什么，主页都不会显示多边形。我该怎么做？
这里是什么样的newPolygons JSON字符串看起来像一个例子：
[[{"H":14.56754606924714,"L":120.99225461483002},{"H":14.567213783453319,"L":120.9916752576828},{"H":14.566736121747363,"L":120.99207758903503}],[{"H":14.566383066777853,"L":120.99221169948578},{"H":14.566325954891425,"L":120.99138557910919},{"H":14.565635419093956,"L":120.9915840625763}]]
但我还是用JSON.parse上。
下面是我用servlet的代码，导致第二页：
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String elementsJSON = (String) request.getParameter("polygons");
request.setAttribute("polygons", elementsJSON);
ServletContext context = getServletContext();
RequestDispatcher dispatch = context.getRequestDispatcher("/second-pageAgain.jsp");
dispatch.forward(request, response);
}
这里是第二页
<script>
var elementsJSON = '<%=request.getAttribute("polygons")%>';
var elements;
function init(){
document.getElementById('savedata').value = elementsJSON;
}
function saveChanges(){
elements = document.getElementById('savedata').value;
alert(elements);
window.location.assign("LoadMaps?polygons=" + elements);
}
</script>
的代码，这里是servlet代码我用回到编辑好的坐标的主页面。
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String elements = (String) request.getParameter("polygons");
System.out.println(elements);
request.setAttribute("polygons", elements);
ServletContext context = getServletContext();
RequestDispatcher dispatch = context.getRequestDispatcher("/maps2Again.jsp");
dispatch.forward(request, response);
}
我试图绘制多边形，我在第二个页面进行编辑，在地图上，但我似乎无法使其出现。
你可以提供一个[最小的，完整的，经过测试和读示例]（http://stackoverflow.com/help/mcve），它演示了这个问题，包括所需JSON的样本。 – geocodezip
@geocodezip我按照要求做了。 :) –
看起来您正在使用API的未公开属性（“H”，“L”）。不要这样做，这些名称可以随API的每次发布而改变（大约每3个月） – geocodezip