API di Google Maps: markerwithlabel.js - Uncaught ReferenceError: google non definito

Ho letto i documenti e gli esempi, ma a quanto pare non riesco a risolvere l'errore di inizializzazione ("Uncaught ReferenceError: google non è definito" + Uncaught ReferenceError: homeLatLng non è definito) quando si tenta di includere il file markerwithlabel.js e mi viene ricordato il messaggio "impossibile caricare qualcosa prima che la mappa sia completata".API di Google Maps: markerwithlabel.js - Uncaught ReferenceError: google non definito

Cosa posso fare?

Ciò che è stato provato:

<head> 
<script async defer src="https://maps.googleapis.com/maps/api/js?key=mykey&callback=initMap"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script> 
<script type="text/javascript"> 
    var map; 
    function initMap() { 

      map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 14, 
       center: {lat: 52.5200066, lng: 13.404954} 
      }); 

      var marker1 = new MarkerWithLabel({ 
        position: homeLatLng, 
        draggable: true, 
        raiseOnDrag: true, 
        map: map, 
        labelContent: "$425K", 
        labelAnchor: new google.maps.Point(22, 0), 
        labelClass: "labels", // the CSS class for the label 
        labelStyle: {opacity: 0.75} 
      }); 
    } 
</script>

fonte

2015-09-21 maxxyoo

markerwithlabel.js richiede un già caricato le mappe-API.

Quando si carica l'API delle mappe in modo asincrono (come nel codice), non è garantito che l'API delle mappe venga caricata quando verrà caricato markerwithlabel.js.

soluzione: caricare le mappe-API in modo sincrono

<script src="https://maps.googleapis.com/maps/api/js?v=3&key=mykey"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script> 
<script type="text/javascript"> 
    var map; 
    function initMap() { 

      map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 14, 
       center: {lat: 52.5200066, lng: 13.404954} 
      }); 

      var marker1 = new MarkerWithLabel({ 
        position: homeLatLng, 
        draggable: true, 
        raiseOnDrag: true, 
        map: map, 
        labelContent: "$425K", 
        labelAnchor: new google.maps.Point(22, 0), 
        labelClass: "labels", // the CSS class for the label 
        labelStyle: {opacity: 0.75} 
      }); 
    } 
google.maps.event.addDomListener(window, 'load', initMap); 
</script>

fonte

2015-09-21 11:28:39

Questo funziona perfetto. (: Grazie per la spiegazione! – maxxyoo

Grazie mille. :-) Ho perso tempo a cercare di risolverlo. – user1355041

"http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js" non esiste. – Meysam

API di Google Maps: markerwithlabel.js - Uncaught ReferenceError: google non definito

risposta

Problemi correlati