Come utilizzare google-maps-api-v3 senza aggiungere tag script su html

Question

ho automatizzato il mio sviluppo in anteprima, utilizzando bower, gulp e browserify. Sto usando una libreria chiamata Gmaps per gestire le chiamate API a google maps. Il problema è che devo aggiungere sul mio html un tag script prima di importare i gmaps.

<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true"></script>

ho provato, senza fortuna, per scaricare il codice js dal link sceneggiatura e concat ai miei altri file js, nella speranza di creare un all.min.js ed evitare la necessità di avere più di un tag script sul mio sito.

Potrei solo riuscire a fare questo lavoro aggiungendo il tag script in html. Esiste comunque l'uso di google maps api all'interno di file concatenati?

Answer 1

Sebbene non riesca a trovare alcuna menzione specifica nella documentazione di Google Maps, non credo che sarebbe una buona idea.

La richiesta per il file javascript non è una semplice libreria statica. Se visiti lo https://maps.google.com/maps/api/js, vedi che ci sono informazioni contenute nella versione dell'API interna di Google da utilizzare, quindi se lo hai concatenato nel tuo sito js potresti scoprire che smetterà di funzionare se Google modificherà le API interne e/o il numero di versione.

Il sensore = true param è anche importante se si richiedono le informazioni di geolocalizzazione dell'utente nel browser, che andrebbero perse se si concat'd lo script.

Answer 2

Quando si desidera utilizzare le mappe-API, senza aggiunta <script> -Elementi nel documento La risposta è chiaramente: No Il mappe-API ha non solo utilizzare lo script 1, si inietta più script nel documento .

Ma quando la domanda è correlata al numero di script che è necessario includere "manualmente", la risposta è sì.

E 'possibile caricare le mappe-API in modo asincrono con una richiamata, il flusso di lavoro sarebbe:

1. load the maps-API asynchronously
2. creare una funzione (la funzione che avete definito come richiamata al punto 1 #)
3. All'interno della richiamata:
   1. inizializzare GMaps
   2. run le istruzioni che creano la mappa tramite GMaps

---

window.addEventListener('load',function(){ 

    var script = document.createElement('script'); 
    script.type = 'text/javascript'; 
    script.src = 'https://maps.googleapis.com/maps/api/js?v=3&callback=initGmaps'; 
    document.body.appendChild(script); 
}); 


function initGmaps(){ 
    //paste here the contents of gmaps.js 
    //........ 

    //then use GMaps 
    new GMaps({ 
     div: '#map', 
     lat: 0, 
     lng: 0, 
     zoom:1 
     }); 
} 

Demo: http://jsfiddle.net/doktormolle/cr1w32qn/