0

Google マップ v3 非同期マップを自分のサイトに実装しようとしていますが、その方法とほぼ同じです。ただし、ページに地図は読み込まれません! 誰かがここで何か間違っていると思いますか?

<script type="text/javascript">

google.maps.visualRefresh = true;

function initialize() {
  var mapOptions = {
    zoom: 18,
    center: new google.maps.LatLng(42.7870,-86.1023),
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };

  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

}

function loadScript() {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?sensor=false' +
      'callback=initialize';
  document.body.appendChild(script);
}

window.onload = loadScript;

</script>

と

<div id="map-canvas"></div>

このページの CSS は非常に単純です。

html, body, #map-canvas {
  margin: 0;
  padding: 0;
  height: 100%;
}

何かご意見は？

4

2 に答える 2

1

2つの問題があります。

  1. この行を移動

    google.maps.visualRefresh = true;

    の先頭までinitialize。API を非同期的にロードするとgoogle、この行が実行される時点でまだ定義されていない (デバッガーがこれを通知する必要があります) 場合、このエラーにより、後続のすべての命令が実行されなくなります。

  2. script.src = 'https://maps.googleapis.com/maps/api/js?sensor=false' + 'callback=initialize';

    後にアンパサンドを追加false

于 2013-08-20T14:53:12.870 に答える