2014-01-14 91 views
0

我正在與谷歌地圖dealerlocator工作。問題是當我點擊一個圖標時,infowindow會打開錯誤的窗口。我使用一個XML導入。一切都進展順利,直到infowindow。谷歌地圖event.addListener與xml

訪問網站https://www.turbho.com/dealerview.php

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD2maN7CjzWtwI6yuHj8lX078NzV0Ywkg0&sensor=false"></script> 

{literal} 
<script> 
    var map; 
    function initialize() { 
     var mapOptions = { 
     zoom: 12, 
     mapTypeId: 'roadmap' 

     }; 

     map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

     // Try HTML5 geolocation 
      if(navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(position) { 
       var pos = new google.maps.LatLng(position.coords.latitude, 
               position.coords.longitude); 

       var infowindow = new google.maps.InfoWindow({ 
       map: map, 
       position: pos, 
       panControl: true, 
      zoomControl: true, 
       scaleControl: true, 
       content: 'U bent nu hier.' 
       }); 

       map.setCenter(pos); 
      }, function() { 
       handleNoGeolocation(true); 
      }); 
      } else { 
      // Browser doesnt support Geolocation 
      handleNoGeolocation(false); 
      } 

      var image = 'https://turbho.com/img/logoturbhogooglesmall.png'; 
      // Change this depending on the name of your PHP file 
      downloadUrl("xml/datacomplete.xml", function(data) { 
      var xml = data.responseXML; 
      var markers = xml.documentElement.getElementsByTagName("marker"); 

      for (var i = 0; i < markers.length; i++) { 
       var name = markers[i].getAttribute("name"); 
       var address = markers[i].getAttribute("address"); 
       var zipcode = markers[i].getAttribute("zipcode"); 
       var town = markers[i].getAttribute("town"); 
       var anchor = markers[i].getAttribute("anchor"); 
       var website = markers[i].getAttribute("website"); 
       var point = new google.maps.LatLng(
        parseFloat(markers[i].getAttribute("lat")), 
        parseFloat(markers[i].getAttribute("lng"))); 
       var html = "<span style='font-size:12px;'><b>" 
           + name + "</b> <br />" 
           + address + "<br />" 
           + zipcode + " " + town + "<br /><br />" 
           + website + "<br /><br />" 
           + anchor + "</span>"; 


       var marker = new google.maps.Marker({ 
       map: map, 
       position: point, 
       icon: image 
       }); 

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

       google.maps.event.addListener(marker, 'click', function() { 
        infowindow.open(map,marker); 

       }); 

      } 

      }); 

    } 



     function downloadUrl(url, callback) { 
      var request = window.ActiveXObject ? 
       new ActiveXObject('Microsoft.XMLHTTP') : 
       new XMLHttpRequest; 

      request.onreadystatechange = function() { 
      if (request.readyState == 4) { 
       request.onreadystatechange = doNothing; 
       callback(request, request.status); 
      } 
      }; 

      request.open('GET', url, true); 
      request.send(null); 
     } 

     function doNothing() {} 





    function handleNoGeolocation(errorFlag) { 
     if (errorFlag) { 
     var content = 'Error: The Geolocation service failed.'; 
     } else { 
     var content = 'Error: Your browser doesn\'t support geolocation.'; 
     } 

     var options = { 
     map: map, 
     position: new google.maps.LatLng(60, 105), 
     content: content 
     }; 

     var infowindow = new google.maps.InfoWindow(options); 
     map.setCenter(options.position); 
    } 



    google.maps.event.addDomListener(window, 'load', initialize); 

</script> 
{/literal} 

<div id="map-canvas"></div> 

回答

0

的問題就解決了。我使用了一個函數見下面,併爲我工作。

function add_marker(latlng,title,box_html,image) 
      { 
       //create the global instance of infoWindow 
       if(!window.infowindow) 
       { 
       window.infowindow=new google.maps.InfoWindow(); 
       } 

       var marker = new google.maps.Marker({ 
        position: latlng, 
        map: map, 
        title: title, 
        icon: image 
       }); 

       google.maps.event.addListener(marker, 'click', function() { 
       infowindow.close(); 
       infowindow.setContent(box_html); 
       infowindow.open(map,this) 
       }); 
       return marker; 
      } 

thanx的幫助 範尼