Ich versuche, das Google Maps-API zu verwenden, um eine einzelne Karte anzuzeigen. Ich benutze Javascript.Karte wird nicht angezeigt, wenn Google Maps API verwendet wird
Es sollte eine einzelne Seite mit einer Kopfzeile und einer Karte unter der Kopfzeile sein. Ich habe mich kürzlich für das Google Maps-API angemeldet. Daher bin ich mir nicht sicher, ob der API-Schlüssel eine bestimmte Zeit benötigt, um aktiv zu sein oder nicht. Ich habe andere CSS-Dateien und eine googlemaps.js-Datei, die noch nichts enthält.
Hier ist mein Code. Irgendwelche Ideen, warum es nicht funktioniert?
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, intial-scale=1.0;'>
<title>API(s)</title>
<link rel='stylesheet' href='styles/semantic.min.css'>
<link rel='stylesheet' href='styles/main.css'>
</head>
<body>
<div class="ui two column centered stackable grid container">
<div class="column">
<h1 class="goog-header">Location Based Image Search</h1>
</div>
</div>
<div class="ui one column stackable grid container js-images-container">
<div class="column">
<div id="map"></div>
</div>
</div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCXTmorapOu1WquB3VlsLrckhE45Bgfrfw&callback=initMap" async defer></script>
<script src='javascript/googlemaps.js'></script>
</body>
</html>
Add Breite und Höhe auf der Karte div Element – Vashtamyty