我正在嘗試使用由單選按鈕控制的 Google Maps api 在 php 頁面中繪制標記。所有資料標記都正確加載（json），但地圖未呈現。請參閱下面我嘗試運行的代碼。控制臺上沒有腳本例外，該run()方法正確回傳所有緯度/經度/值資料！
<script>
var latlng = { lat: 19.7999, lng: 42.5121 };
var marker;
var map;
var markers=[];
function addmarker(map, lat, lng, title ){
marker = new google.maps.Marker({
position:{ lat:lat,lng:lng },
title:title,
draggable:true,
map:map
});
markers.push( marker );
}
function initialize() {
var mapCanvas = document.getElementById('mapArea');
var mapOptions = {
center: latlng,
zoom: 19,
mapTypeId: google.maps.MapTypeId.SATELLITE
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<script>
function run() {
var radio = "";
for (i = 0; i < document.getElementsByName('rd').length; i ) {
if (document.getElementsByName('rd')[i].checked) {
radio = document.getElementsByName('rd')[i].value;
}
}
initialize();
$.ajax({
dataType: 'JSON',
url: 'http://ws.net/data.php?' radio,
success: function(data) {
markers.forEach( function( e,i,a ){
e.setMap( null );
});
for( var o in data ){
var lat=Number(data[o].lat);
var lng=Number(data[o].lon);
var val= data[o].value;
addmarker.call( this, map, lat, lng, val );
}
},
error: function( err ){
console.log( err );
}
})
}
</script>
<body >
<form action="" method="post">
<input type="radio" value="car" name="rd" />Car.
<input type="radio" value="bike" name="rd" />Bike
<input type="button" value="send" onclick="run();"/>
</form>
<div id="mapArea" style="width: 1000px; height: 600px;"> </div>
</body>
</html>
uj5u.com熱心網友回復：
- 在函式 initialize() 中，添加：
map = new google.maps.Map(mapCanvas, mapOptions);
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/313508.html
標籤：javascript json 阿贾克斯 谷歌地图
上一篇：在兩個打開的活動之間來回移動資料