2014-01-22 7 views
-1

지도에 마커를 표시하고 각 마커마다 몇 가지 정보가 표시된 팝업을 표시해야합니다. 여기 내 코드 :지도상의 Google지도 및 마커

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
    var createMap = function() { 
     var address = document.getElementById("address").value; 
     var geocoder = new google.maps.Geocoder(); 
     geocoder.geocode({'address': address}, function(results,status){ 
      if (status == google.maps.GeocoderStatus.OK) { 
       var options = { 
        zoom: 12, 
        center: results[0].geometry.location, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }; 
       var map = new google.maps.Map(document.getElementById('map'), options); 
       setMarkers(map, sites); 
      } 
      else { 
       alert("Problema nella ricerca dell'indirizzo: " + status); 
      } 
     }); 
    } 

    //Aggiungo i marker alla mappa 
    function setMarkers(map, markers) { 
     for (var i = 0; i < markers.length; i++) { 
      var sites = markers[i]; 
      var siteLatLng = new google.maps.LatLng(sites[1], sites[2]); 
      var marker = new google.maps.Marker({ 
       position: siteLatLng, 
       map: map, 
       title: sites[0], 
       zIndex: sites[3], 
       html: "<b>"+sites[0]+"</b><br>"+sites[4] 
      }); 

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

    //Elenco dei marcatori da aggiungere 
    var sites = [[ 'Veterinari Associati', 45.448405,9.19823 , 1 , 'Via Palladio 4 - 20100 Milano (MI)'],]; 


    window.onload = createMap; 
</script> 
<input id="address" type="hidden" value="Milan"> 
<div id="map" style="width:345px; height:306px;"></div> 

모든 예상대로, 아이콘의 위치하지만 시장에 클릭하면 팝업이 doen't 작품이 표시됩니다. 문제가있는 곳을 이해할 수 없습니다 ...

+0

을 시도 this.html == marker.html의 –

+0

가능한 중복 [Google지도 JS API v3의 - 간단한 다중 마커 예] (http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) – geocodezip

답변

2

당신은 힘 intialise의 정보창, 내가 해달라고 생각이

google.maps.event.addListener(marker, "click", function() { 
    var infowindow = new google.maps.InfoWindow(); 
    infowindow.setContent(this.html); 
    infowindow.open(map, this); 
}); 
+0

! 나는 그것을 놓친다! –

+0

당신은 오신 것을 환영합니다! –

1

정보창을 설정하고 열기 전에 정보창을 설정하지 않았기 때문입니다. 이 삽입 :

var infowindow = new google.maps.InfoWindow(); 
+0

감사합니다! 나는 그것을 놓친다! 덕분에 –