recherche

Maison >interface Web >js tutoriel >Solution à Google Maps qui n'ouvre pas les compétences Javascript

Solution à Google Maps qui n'ouvre pas les compétences Javascript

WBOY
WBOYoriginal
2016-05-16 16:40:122024parcourir

Google Maps est bloqué par le Grand Firewall de Chine, il n'est donc pas nécessaire de citer directement l'API Google Maps sous le nom de domaine http://maps.googleapis.com/maps/api/js?sensor=false&langage= fr. Au lieu de cela, remplacez-le par http:/ Pour l'adresse /maps.google.cn/maps/api/js?sensor=false, le nom de domaine national de google.cn n'a pas été bloqué et peut être utilisé.

Remarque : bien que google.cn puisse être utilisé, il générera des js pour référencer les ressources de google.com, ce qui entraînera un retard dans le rendu de la carte, alors ne placez pas l'API Google Maps devant votre contenu, comme dans la balise head, placez-le plutôt à la fin du contenu ou de la balise de fin HTML pour éviter que le contenu de votre page ne soit vide et que le navigateur ne puisse pas l'afficher.

N'utilisez pas l'événement window.onload pour dessiner, sinon la carte Google ne s'affichera pas à temps car les ressources de google.com doivent être chargées, et les ressources de google.com sont interceptées, ce qui provoquera la requête pour expirer (environ 2 minutes). Dessinez Google Maps.

Utilisez le paramètre de rappel de Google pour transmettre un nom de fonction de rappel. Après les tests, cette méthode rend la carte Google plus rapidement que l'utilisation de l'événement window.onload.

Exemple de code : 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网站引用谷歌地图打不开解决办法:使用google.cn</title>
</head>

<body>

<div id="map_canvas" class="map" style="height: 350px;width: 500px;"></div></body>
<script type="text/javascript" src="http://maps.google.cn/maps/api/js&#63;sensor=false&callback=renderGoogleMap"></script>
<script type="text/javascript">
  function renderGoogleMap() {
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({ 'address': '广西桂林市中心广场' }, function (results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
    var mapOptions = {
      zoom: 17,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
  }
</script>

</body>
</html>

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Résumé du mécanisme d'écoute des événements js (capture d'événements)_compétences javascriptArticle suivant：Résumé du mécanisme d'écoute des événements js (capture d'événements)_compétences javascript

Articles Liés

Voir plus