Heim > Web-Frontend > js-Tutorial > Lösung dafür, dass Google Maps keine JavaScript-Kenntnisse öffnet

Lösung dafür, dass Google Maps keine JavaScript-Kenntnisse öffnet

WBOY
Freigeben: 2016-05-16 16:40:12
Original
1998 Leute haben es durchsucht

Google Maps wird von der Great Firewall of China blockiert, daher besteht keine Notwendigkeit, die Google Maps API unter dem Domainnamen http://maps.googleapis.com/maps/api/js?sensor=false&sprache= direkt anzugeben en. Ändern Sie es stattdessen in http:/. Für die Adresse /maps.google.cn/maps/api/js?sensor=false wurde der inländische Domainname google.cn nicht blockiert und kann verwendet werden.

Hinweis: Obwohl google.cn verwendet werden kann, werden einige JS ausgegeben, um auf die Ressourcen von google.com zu verweisen, was zu einer Verzögerung beim Rendern der Karte führt. Stellen Sie daher die Google Maps-API nicht vor Ihren Inhalt. Platzieren Sie es stattdessen am Ende des Inhalts- oder HTML-End-Tags, um zu verhindern, dass der Inhalt Ihrer Seite leer ist und der Browser den Inhalt nicht anzeigen kann.

Verwenden Sie zum Zeichnen nicht das Ereignis window.onload, da die Google-Karte sonst nicht rechtzeitig angezeigt wird, da die Ressourcen von google.com geladen werden müssen und die Ressourcen von google.com abgefangen werden, was zu einer Anforderung führt Zeitüberschreitung (ca. 2 Minuten).

Verwenden Sie den Callback-Parameter von Google, um einen Callback-Funktionsnamen zu übergeben. Nach dem Testen rendert diese Methode die Google-Karte schneller als die Verwendung des window.onload-Ereignisses.

Beispielcode:

<!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>
Nach dem Login kopieren

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage