谷歌地圖API V3 - 從查詢結果中動態添加多個標記

Question

我想在頁面上設置一個地圖，下面有一些鏈接，點擊時會動態地查詢我的數據庫和結果集輸出地圖。我花了很多時間用google搜索，但找不到我期待的內容。我儘可能使用AJAX返回經緯度座標，但我在嘗試在地圖上創建標記時出錯了，雖然我沒有生成任何錯誤，但沒有出現任何內容。

Answer 1

你有這樣的創造新的標誌物：

var marker = new google.maps.Marker({ 
    position: results.DATA[i][2], 
    map: map, 
    title:"New marker" 
}); 
marker.setMap(map); 

的results.DATA[i][2]值是像 「54.016893，-0.970721」。但位置必須是一個經緯度對象：

// turn "54.016893,-0.970721" into [54.016893,-0.970721"] 
var latLng = results.DATA[i][2].split(","); 

var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(latLng[0], latLng[1]), 
    map: map, 
    title:"New marker" 
}); 

PS：另外，如果您指定的的MarkerOptions地圖，你不需要也然後請呼叫setMap（）函數。

Answer 2

代碼沒有測試過，但你可以做這樣的事情

申報地圖上，標記

var map; 
var markersArray = []; 
var myOptions = { 
    zoom: 10, 
    center: latlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

以下功能將增加一個點映射

function plotPoint(srcLat,srcLon,title,popUpContent,markerIcon) 
{ 
    var myLatlng = new google.maps.LatLng(srcLat, srcLon);    
    var marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      title:title, 
      icon: markerIcon 
     }); 
    markersArray.push(marker); 
    var infowindow = new google.maps.InfoWindow({ 
     content: popUpContent 
    }); 
     google.maps.event.addListener(marker, 'click', function() { 
     infowindow.open(map,marker); 
    });           
} 

獲取您的積分，並添加他們就像

var lat = 44.856051; 
var lng = -93.242539; 
plotPoint(lat,lng,'Mall of America','<span class="gBubble"><b>Mall of America</b><br>60 East Brodway<br>Bloomington, MN 55425</span>');