Динамически добавлять скрипт в Chrome - PullRequest
Новая
       9

Динамически добавлять скрипт в Chrome

0 голосов
/ 12 октября 2018

У меня есть немного кода, который используется для загрузки API карты Google и динамического получения ключа.Он отлично работает в 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 будет огромной помощью.

1 Ответ

0 голосов
/ 12 октября 2018

Похоже на проблему с заказом. 

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