在谷歌地圖API上的Infowindow幫助3

與其他人在本網站上有類似的問題，它只顯示所有標記中的最後一個標記的信息窗口信息。似乎無法用任何解決方案解決這個問題。另外，我的最後一個標記根本不顯示信息窗口。在谷歌地圖API上的Infowindow幫助3

<script src="http://www.google.com/jsapi"></script> 
<script type="text/javascript" src="data2.json"></script> 
<script type="text/javascript" src="js/markerclusterer.js"></script> 

<script type="text/javascript"> 
    google.load('maps', '3', { 
    other_params: 'sensor=false' 
    }); 
    google.setOnLoadCallback(initialize); 

    function initialize() { 

var center = new google.maps.LatLng(55.4419, -4.1419); 

var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 5, 
     center: center, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 


var markers = []; 
for (var i = 0, dataPhoto; dataPhoto = data.markers[i]; i++) { 
     var latLng = new google.maps.LatLng(dataPhoto.latitude,dataPhoto.longitude); 
     var theTitle = dataPhoto.address; 
     var contentString = '<div align="left"><img src="logo.gif" alt="" width="242" height="71" /><br /><br /><p style="color:#000000;">' + data.markers[i].address + '<br />' + dataPhoto.telephone + '</p></div>'; 



     var infowindow = new google.maps.InfoWindow({ 
     content: contentString, 
     }); 



    var thisIcon = 'markers/image.png'; 


       for (var i = 0, marker; marker = markers[i]; i++) {google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,this);}); 
     } 


     var marker = new google.maps.Marker({ 
     position: latLng, 
     clickable: true, 
     title: theTitle, 
     icon: thisIcon, 
     }); 

     markers.push(marker); 
    } 
    var markerCluster = new MarkerClusterer(map, markers); 


    } 


</script>

任何幫助非常感謝！

來源

2010-10-20 Cathy

我沒有測試過這一點，但它應該工作 - 也請看看：http://code.google.com/apis/maps/documentation/javascript/events.html#EventClosures

<script src="http://www.google.com/jsapi"> 
</script> 
<script type="text/javascript" src="data2.json"> 
</script> 
<script type="text/javascript" src="js/markerclusterer.js"> 
</script> 
<script type="text/javascript"> 
    google.load('maps', '3', { 
     other_params: 'sensor=false' 
    }); 
    google.setOnLoadCallback(initialize); 

    function initialize(){ 

     var center = new google.maps.LatLng(55.4419, -4.1419); 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 5, 
      center: center, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 


     var markers = []; 
     for (var i = 0, dataPhoto; dataPhoto = data.markers[i]; i++) { 
      var latLng = new google.maps.LatLng(dataPhoto.latitude, dataPhoto.longitude); 
      var theTitle = dataPhoto.address; 
      var contentString = '<div align="left"><img src="logo.gif" alt="" width="242" height="71" /><br /><br /><p style="color:#000000;">' + data.markers[i].address + '<br />' + dataPhoto.telephone + '</p></div>'; 
      var thisIcon = 'markers/image.png'; 
      var marker = new google.maps.Marker({ 
       position: latLng, 
       clickable: true, 
       title: theTitle, 
       icon: thisIcon, 
      }); 

      attachIWindow(contentString, marker); 


      markers.push(marker); 
     } 
     var markerCluster = new MarkerClusterer(map, markers); 


    } 

    function attachIWindow(content, marker){ 


     var infowindow = new google.maps.InfoWindow({ 
      content: content, 

     }); 
     google.maps.event.addListener(marker, 'click', function(){ 
      infowindow.open(map, marker); 
     }); 
    } 
</script>

來源

2010-10-20 20:26:47 Michal

謝謝！只需要將解決方案中的函數attachIWindow定義在上面的位置，然後它就可以完美工作！ – Cathy 2010-10-21 07:56:45

如果我得到這個權利，那麼請看看關閉，並嘗試正確理解它們。然後javascript魔術會發生！

來源

2010-10-20 19:04:08

我們可以利用關閉來解決這個問題

使用下面的代碼片段添加信息窗口到標記

function AddInfoWidnow(marker,message) 
{ 
    var infowindow = new google.maps.InfoWindow({ content: message }); 

    google.maps.event.addListener(marker, 'click', function() { 

    infowindow.open(marker.get('map'), marker); 

    }); 

}

要查看工作樣品，請參閱here

來源

2014-02-28 12:36:16

在谷歌地圖API上的Infowindow幫助3

回答

相關問題