Google Maps - fenêtre d'information se fermant avec une minuterie

StackOverflow https://stackoverflow.com/questions/3504817

  •  29-09-2019
  •  | 
  •  

Question

J'ai un petit problème avec les cartes de l'API Google, je me demandais si quelqu'un pouvait m'aider.J'essaie d'ouvrir des fenêtres d'informations avec du HTML contenant un HREF.Maintenant, je pourrais utiliser le "X" pour fermer la fenêtre, mais je préfère une deuxième méthode de minuterie Javascript pour fermer les fenêtres d'informations comme indiqué ci-dessous.

setTimeout('infowindow.close(map,marker)','2000');

Le navigateur signale cependant que la fenêtre d'informations n'existe pas après l'expiration des 2 secondes.Pour résoudre le problème, j'ai tenté d'ajouter un objet infowindow et des objets marqueurs à un tableau de portée globale, mais cela n'a pas résolu le problème.

J'ai remis le code dans son état d'origine et je serais reconnaissant pour tout conseil sur le problème. 

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title></title> 
    <link href="http://code.google.com/apis/maps/documentation/javascript/examples/standard.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 

    var geocoder;
    var map;
    var markers = [];
    var info = [];
    var i = 0;

    function initialize()
    {
       geocoder = new google.maps.Geocoder();
       var latlng = new google.maps.LatLng(40.768505, -111.853244);
       var myOptions =
       {
          zoom: 8,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
       }
       map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
       addPostCode('bb9 5pl','HTML');
       addPostCode('bb9 7de','HTML');
       addPostCode('bb12 7nq','HTML');
       addPostCode('bb4 6be','HTML');
    }

    function addPostCode(zip, html)
    {
       geocoder.geocode(
       {
          'address': zip
       }, function (results, status)
       {
          if (status == google.maps.GeocoderStatus.OK)
          {
             map.setCenter(results[0].geometry.location);
             var marker = new google.maps.Marker(
             {
                map: map,
                position: results[0].geometry.location,
                name: zip
             });

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

            google.maps.event.addListener(marker, 'mouseover', function() 
            { 
              infowindow.open(map,marker); 
              setTimeout('infowindow.close(map,marker)','2000'); 
            });


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

    function checkZip(zip)
    {
       var distance = Number.MAX_VALUE;
       var index = 0;
       geocoder.geocode(
       {
          'address': zip
       }, function (results, status)
       {
          if (status == google.maps.GeocoderStatus.OK)
          {
             for (ix = 0; ix < markers.length; ix++)
             {
                var tmp = getDistance(results[0].geometry.location, markers[ix].position);
                if (tmp < distance)
                {
                   distance = tmp;
                   index = ix;
                }
             }
             alert('nearest zipcode is :' + markers[index].name + ' Distance:' + distance) 
          }
       });
    }

    function getDistance(latlng1, latlng2)
    {
       var R = 6371; // Radius of the earth in km 
       var dLat = (latlng2.lat() - latlng1.lat()) * Math.PI / 180; // Javascript functions in radians 
       var dLon = (latlng2.lng() - latlng1.lng()) * Math.PI / 180;
       var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) + Math.cos(latlng1.lat() * Math.PI / 180) 
               * Math.cos(latlng2.lat() * Math.PI / 180) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
       var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
       var d = R * c; // Distance in km 
       d = d * 0.621371192;
       return d;
    }

    </script> 
    </head> 
    <body onload="initialize()"> 
      <div> 
        <input id="address" type="textbox" value=""> 
        <input type="button" value="Geocode" onclick="checkZip(getElementById('address').value)"> 
      </div> 
    <div id="map_canvas" style="height:500px; width: 600px;"></div> 
    </body> 
    </html>
Était-ce utile?

La solution

infowindow dans votre appel setTimeout est hors de portée lorsqu'il se déclenche.Remplacez cet appel par le suivant pour corriger cela en utilisant Fermetures:

setTimeout(function(){infowindow.close();}, '2000');
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top