多标记问题（Google Maps API v3）

Question

我正在使用Google Maps API v3，并试图在地图上放置多个标记。

这是我的代码：

var map; 
var geocoder; 
var bulleInfo = null; 
var marker = null; 
var siteLatLng; 
var globalAddress; 
var globalLocation; 
var globalFirstName; 
var globalLastName; 


function initialize() 
{ 
    var centerMap = new google.maps.LatLng(48, 1); 

    var myOptions = { 
     zoom: 4, 
     center: centerMap, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    geocoder = new google.maps.Geocoder(); 

    bulleInfo = new google.maps.InfoWindow({ 
        content: "loading..." 

      }); 
} 


function codeAddress(profiles) 
{ 
    for(i=0; i < profiles.length; i++) { 
     globalLocation = profiles[i].location; 
     globalFirstName = profiles[i].first_name; 
     globalLastName = profiles[i].last_name; 

     geocoder.geocode({'address': globalLocation}, function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
       globalAddress = results[0].geometry.location; 
       putMarkers(); 
      } 

      else { 
       alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
    } 

} 

function putMarkers() 
{ 
    marker = new google.maps.Marker({ 
     map: map, 
     position: globalAddress, 
     zIndex: i, 
     html: globalFirstName 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     bulleInfo.setContent(this.html); 
     bulleInfo.open(map, this); 
    }); 

} 

的问题是，所有的指标都是一样的（等于曲线的最后一个元素）！

出了什么问题？

谢谢！

Answer 1

我瞥了一眼你的代码，但是无法确定为什么如果不同的地址被提供，标记就会被复制。请参阅demo这里创建多个标记，希望他们帮助。

用于初始化地图和创建标记的Javascript显示在下面。

var map, markersArray, infowindow; 

function initialize() { 
    var myOptions = { 
     zoom: 14, 
     center: new google.maps.LatLng(51.5001524, -0.1262362), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
    myOptions); 

    infowindow = new google.maps.InfoWindow({ 
     size: new google.maps.Size(150, 50) 
    }); 

    google.maps.event.addListener(map, 'click', function() { 
     infowindow.close(); 
    }); 

    markersArray = []; 
} 

function createMarker(latlng, html, zoom) { 
    var contentString = html; 
    var marker = new google.maps.Marker({ 
     position: latlng, 
     map: map, 
     zIndex: Math.round(latlng.lat() * -100000) << 5 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(contentString); 
     infowindow.open(map, marker); 
    }); 
    marker.MyZoom = zoom; 
    return marker; 
} 


function addMarker() { 

    var lat = parseFloat(document.getElementById('lat').value); 
    var lng = parseFloat(document.getElementById('lng').value); 
    if (!isNaN(lat) && !isNaN(lng)) { 
     point = new google.maps.LatLng(lat, lng); 
     map.setCenter(point); 
     zoom = 14; 
     alert(point); 
     marker = createMarker(point, "<h3>Marker" + (markersArray.length + 1) + " " + point + "</h3>", zoom); 

     var newLi = document.createElement("li"); 
     var newA = document.createElement("a"); 
     var newText = document.createTextNode("Marker " + (markersArray.length + 1)); 
     newA.appendChild(newText); 
     newLi.appendChild(newA); 
     newA.setAttribute('onclick', 'displayMarker(this.innerHTML);'); 
     document.getElementById('marker_tabs').appendChild(newLi); 
     markersArray.push(marker); 

    } else { 
     alert("Kindly Enter Co-ordinates" + lat + " " + lng); 
    } 

} 

function displayMarker(text) { 

    marker_id = parseInt(text.split(" ")[1]) - 1; 
    marker = markersArray[marker_id]; 
    map.setCenter(marker.position); 
    infowindow.setContent("<h3>Markers " + (marker_id + 1) + " " + marker.position + "</h3>"); 
    infowindow.open(map, marker); 
} 

function getMarker() { 
    var address = $('#address').val(); 
    address = address.replace(/ /g, "+"); 

    $.getJSON("getjson.php?address=" + address, 

    function (data) { 
     lat = data.results[0].geometry.location.lat; 
     lng = data.results[0].geometry.location.lng; 
     point = new google.maps.LatLng(lat, lng); 
     map.setCenter(point); 
     zoom = 14; 
     marker = createMarker(point, "<h3>Marker" + (markersArray.length + 1) + " " + point + "</h3>", zoom); 

     var newLi = document.createElement("li"); 
     var newA = document.createElement("a"); 
     var newText = document.createTextNode("Marker " + (markersArray.length + 1)); 
     newA.appendChild(newText); 
     newLi.appendChild(newA); 
     newA.setAttribute('onclick', 'displayMarker(this.innerHTML);'); 
     document.getElementById('marker_tabs').appendChild(newLi); 
     markersArray.push(marker); 
    }); 

}