Javascript谷歌地图不工作

Question

我是新手谷歌地图API和它的图书馆。我想知道为什么我没有看到我的页面中的地图。

这是代码：

<script src="http://maps.googleapis.com/maps/api/js?v=3"></script> 
    <script> 
     var latlong = new google.maps.LatLng(-0.179041, -78.499211); 
     console.log(latlong); 
     var mapOptions = { 
      zoom: 13, 
      center: latlong, 
      disableDefaultUI: false, 
      navigationControl: false, 
      mapTypeControl: false, 
      scrollwheel: false, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('city_map'), 
       mapOptions); 
     console.log(map); 
     google.maps.event.trigger(map, 'resize'); 
     map.setZoom(map.getZoom()); 

     var marker = new google.maps.Marker({ 
      position: latlong, 
      map: map, 
      title: "Test" 
     }); 
</script> 

你看我console.logging的latlong和map，他们看起来很好..反正，我希望它是不是非常明显。

Answer 1

你没有高度和宽度附加到div，这就是为什么。看看这个小提琴。

#city_map{ 
min-height:300px; 
min-width:300px; 
} 

https://jsfiddle.net/dm7j7494/1/