地址标记人口普查

Question

以下是我用来从地址数组中填充标记的代码，但它没有显示任何标记或将地图显示到相应的div中，请告诉我我做错了什么以及如何解决这个问题。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
$(document).ready(function(){

  var myOptions = {
    center: new google.maps.LatLng(54, -2),
    zoom: 6,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  var addressArray = new Array("41 Green Ln, Handsworth, Birmingham, West Midlands B21 0DE, UK","BT27 4SB","Norwich");
  var geocoder = new google.maps.Geocoder();
  var markerBounds = new google.maps.LatLngBounds();

  for (var i = 0; i < addressArray.length; i++) {
    geocoder.geocode( { 'address': addressArray[i]}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
        });

        markerBounds.extend(results[0].geometry.location);
        map.fitBounds(markerBounds);
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }    

});
</script>
<div id="map_canvas"></div>

- user2213071

---

你看到任何控制台错误吗？ - Cianan Sims

@CiananSims 不是，这是我的完整代码，我只看到一个空白屏幕，我尝试实现了这个教程的代码并且按照原样复制，但是不知道为什么它没有显示，请帮忙看看，http://www.rocketmill.co.uk/the-adding-markers-google-maps-tutorial - user2213071

Answer 1

为了让地图显示，您需要使用CSS为#map_canvas设置绝对宽度/高度。

示例fiddle：http://jsfiddle.net/sCvJk/

- metadept