2012-10-16 99 views
1

经过大量研究后,我似乎无法确定为什么在打开新窗口时无法关闭InfoWindow。我迄今为止试过的所有东西都会导致InfoWindow根本无法显示。关闭每个InfoWindow打开新的InfoWindow

我在这里试过建议:Google Map API v3 ~ Simply Close an infowindow?和其他地方,但我想知道如果这是一个问题,我不知道这是造成这个问题。无可否认,这是从其他来源拼凑而成的。我非常感谢你的帮助。

<html> 
    <head> 

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Google Maps JavaScript API v3 Example: Geocoding Simple</title> 
    <link href="https://code.googleapis.com/maps/documentation/javascript/examples/default.css" rel="stylesheet"> 
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script> 
    var geocoder; 
    var map; 
    var infoWindow; 


    function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(37.77014301036805, -79.48862973916635); 
    var mapOptions = { 
     zoom: 12, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

    } 

    function codeAddress() { 

    var address = document.getElementById("address").value; 
    geocoder.geocode({ 'address': address}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     map.setCenter(results[0].geometry.location); 
     var loc=[]; // no need to define it in outer function now 
     loc[0]=results[0].geometry.location.lat(); 
     loc[1]=results[0].geometry.location.lng(); 
       var content = '<div id="infoWindow"><iframe src="http://inside.handp.com/map2.php?'; 
     content += 'latitude=' + results[0].geometry.location.lat()+ '&'; 
     content += 'longitude=' + results[0].geometry.location.lng()+'" frameborder="0" allowfullscreen scrolling="no"></iframe></div>'; 


//  display(loc[0]); 
     var marker = new google.maps.Marker({ 
      map: map, 
      position: results[0].geometry.location 


     }); 

     addInfoWindow(marker, content); 

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

    function display(long_lat){ 
    alert(long_lat); 
    } 
    function addInfoWindow(marker, message) { 
      var info = message; 

      var infoWindow = new google.maps.InfoWindow({content: message}); 

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

      }); 

       infoWindow.open(map, marker); 

     } 

    </script> 
    </head> 
<body onload="initialize()"> 
<div id="map_canvas" style="width: 640px; height: 480px;"></div> 
    <div> 
    <input id="address" type="textbox" value="Enter Address"> 
    <input type="button" value="Encode" onclick="codeAddress()"> 
    </div> 
</body> 
</html> 

回答

2

可以只使用一个信息窗口对象和动态设置不同的内容

例如: VAR信息窗口=新google.maps.InfoWindow({maxWidth:200});

添加监听到你的标记物

var marker = new google.maps.Marker({ 
    map: map, 
    info: 'this is info window html', 
    position: results[0].geometry.location 
}); 

google.maps.event.addListener(marker, 'click', function() {    
    infowindow.setContent(this.info); 
    infowindow.open(map, this); 
    map.setCenter(this.getPosition()); 
});