CODEWITHSUNDEEP
javascriptgoogle-maps-api-3
user494461
user494461

Reputation:

google maps map wont show up?

var center = new google.maps.LatLng(18.133333, 21.566667);
var map = new google.maps.Map(document.getElementById('map'), {zoom: 11,center: center,mapTypeId: google.maps.MapTypeId.TERRAIN});

I have a DIV by the name map in my html.

    <div id="map"></div>

the JS is in a function called initialize in myscript.js which I reference in my index.html

-------------edit---------- google maps ref

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

Upvotes: 0

Views: 170

Answers (2)

Duan Walker
Duan Walker

Reputation: 315

are you sure you placed your google maps cdn AFTER your javascript cdns?

<!-- Add jQuery-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Add google maps API -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=place your api key here&callback=initMap"></script>
<script src="assets/js/googleMapsApi.js"></script>

Upvotes: 0

Konrad Dzwinel
Konrad Dzwinel

Reputation: 37913

Set a width and height on this div.

in HTML

 style='width:500px; height: 500px'

or in CSS

#map { width: 500px; height: 500px }

Upvotes: 2

Related Questions