Question

我有一些代码可用于加载Google Map API并动态获取密钥。它可以在Firefox和IE中完美运行，但不能在Chrome中运行。

<script>addScript('&libraries=visualization')</script>


function addScript(str) {
    str = str || '';

    var src = 'https://maps.googleapis.com/maps/api/js?key=' + getMapKey() + str;
    var s = document.createElement('script');

    s.setAttribute( 'src', src );
    s.setAttribute('defer', 'defer');
    document.body.appendChild( s );
}

任何帮助在Chrome中运行该功能都会带来巨大帮助。

Answer 1

看起来像是订购问题。

<script>
function addScript(str) {
    str = str || '';

    var src = 'https://maps.googleapis.com/maps/api/js?key=' + getMapKey() + str;
    var s = document.createElement('script');

    s.setAttribute( 'src', src );
    s.setAttribute('defer', 'defer');
    document.body.appendChild( s );
}
</script>
<script>addScript('&libraries=visualization&callback=initMap')</script>
<div id="map"></div>
<script>
  function initMap() {
  // var fullstack = {lat: 40.705523, lng: -74.009149};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    maxZoom: 19,
    minZoom: 16 ,
    center: {lat: 40.705523, lng: -74.009149},
    disableDefaultUI: false
  });
  var createMarker = function(lat, lng, draggable) {
    return new google.maps.Marker({
      position: {
        lat: lat,
        lng: lng
      },
      map: map,
      draggable: draggable
    })
  }
  var marker = createMarker(40.705523, -74.009149, true);
}
</script>

工作代码段（可在Chrome中运行；无键）：

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

<script>
function addScript(str) {
    str = str || '';

    var src = 'https://maps.googleapis.com/maps/api/js'+ str;
    var s = document.createElement('script');

    s.setAttribute( 'src', src );
    s.setAttribute('defer', 'defer');
    document.body.appendChild( s );
}
</script>
<script>addScript('?libraries=visualization&callback=initMap')</script>
<div id="map"></div>
<script>
  function initMap() {
  // var fullstack = {lat: 40.705523, lng: -74.009149};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    maxZoom: 19,
    minZoom: 16 ,
    center: {lat: 40.705523, lng: -74.009149},
    disableDefaultUI: false
  });
  var createMarker = function(lat, lng, draggable) {
    return new google.maps.Marker({
      position: {
        lat: lat,
        lng: lng
      },
      map: map,
      draggable: draggable
    })
  }
  var marker = createMarker(40.705523, -74.009149, true);
}
</script>

动态将脚本添加到Chrome

1 个答案: