2016-08-19 3 views
0

Ich arbeite an einem kleinen Projekt, das schwer mit Google Maps API funktioniert. Ich habe keine Fehler, aber die Seite, auf der die Karte geladen werden soll, ist leer. Ich denke, das liegt daran, dass das my location-Objekt übergeben wird und die Eigenschaften nicht überprüft werden, sobald das Objekt übergeben wurde.Uncaught Error: Google nicht definiert | Google Maps API

Wenn Sie über die Gogole Karten API wissen und Sie helfen können, würde ich es wirklich schätzen.

/*----------------list of all the global variables---------------------*/ 
 
var map; 
 

 
/*----------------This is the model---------------------*/ 
 
var initialLocation = { 
 
    center:{ 
 
    lng: 33.895593, 
 
    lat: -117.316224 
 
    }, 
 
    zoom: 15 
 
} 
 

 
/*----------------This is the viewmodel---------------------*/ 
 
function initMap(){ 
 
    map = new google.maps.Map(document.getElementById("googleMap"), initialLocation); 
 
} 
 

 
/*----------------This is the view---------------------*/ 
 
$("googleMap").append(map);
html, 
 
.container{ 
 
    height: 100%; 
 
    width: 100%; 
 
    font-family: helvetica, sans-serif; 
 
    margin: 0px; 
 
    padding: 0px; 
 
    background-color: lightgrey; 
 
} 
 

 
#googleMap{ 
 
    height: 100%; 
 
}
<html> 
 
    <head> 
 
    <title>Omar Jandali Udacity Map</title> 
 
    </head> 
 
    <body> 
 
    <div id="container"> 
 

 
    </div> 
 
    <script type="text/javascript" src="collections/underscore.js"></script> 
 
    <script type="text/javascript" src="collections/backbone.js"></script> 
 
    <script type="text/javascript" src="collections/jquery-3.1.0.js"></script> 
 
    <script type="text/javascript" async defer 
 
     src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDik_TF3x4yc96CvWWw12YQ4DMjoG3vfFM&v=3&callback=initMap"></script> 
 
    <script type="text/javascript" src="js/main.js"></script> 
 
    </body> 
 
</html>

Antwort

0

Wenn $("googleMap").append(map); ausführt, map immer noch auf null gesetzt ist. Sie müßten es innerhalb der Rückruffunktion initMap() ausführen, nachdem map das Kartenobjekt zugewiesen wurde, z.

function initMap(){ 
    map = new google.maps.Map(document.getElementById("googleMap"), initialLocation); 
    $("#googleMap").append(map); 
} 
+0

auch, Ihre jQuery-Selektor ein '#' Zeichen-ID, um anzuzeigen, fehlt. Es sollte '$ (" # googleMap ") sein. Append (map)' – Xoundboy

+0

Ich habe das versucht und ich habe ein bisschen herumgemischt, aber immer noch nichts. Es ist leer, ohne Fehler, wenn ich herumgespielt habe, aber es lädt immer noch nichts mit oder ohne den Fehler –

0

versuchen, diese

function initMap(){ 
var latlng = new google.maps.LatLng(-117.316224, 33.895593); 

var mapOptions = {zoom: 7, center:latlng} 

map = new google.maps.Map(document.getElementById("googleMap"), mapOptions); 

} 
Verwandte Themen