Google マップが開かない場合の解決策_JavaScript スキル-jsチュートリアル-php.cn

Google マップが開かない場合の解決策_JavaScript スキル

WBOY

リリース： 2016-05-16 16:40:12

オリジナル

2022 人が閲覧しました

Google マップは中国のグレートファイアウォールによってブロックされているため、ドメイン名 http://maps.googleapis.com/maps/api/js?sensor=false& language= で Google Maps API を直接引用する必要はありません。 ja.代わりに、 http:/ に変更します。アドレス /maps.google.cn/maps/api/js?sensor=false については、google.cn の国内ドメイン名はブロックされていないため、使用できます。

注: google.cn を使用することもできますが、google.com のリソースを参照するための js が出力されるため、地図のレンダリングに遅延が発生するため、コンテンツの前に Google Maps API を配置しないでください。代わりに、head タグ内など、コンテンツの末尾または HTML 終了タグに配置して、ページのコンテンツが空白になり、ブラウザーがコンテンツを表示できなくなるのを防ぎます。

window.onload イベントを使用して描画しないでください。そうしないと、google.com のリソースをロードする必要があり、google.com のリソースがインターセプトされるため、Google マップが時間内に表示されなくなり、リクエストが発生します。タイムアウトします (約 2 分)。

Google のコールバックパラメーターを使用してコールバック関数名を渡します。テスト後、このメソッドは window.onload イベントを使用するよりも速く Google マップをレンダリングします。

サンプルコード:

<!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>

ログイン後にコピー