3

以下は、配列アドレスからマーカーを設定するために使用しているコードですが、マーカーもマップもそれぞれの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>
4

1 に答える 1

2

#map_canvas地図を表示するには、CSS を使用して絶対幅/高さを指定する必要があります。

フィドルの例: http://jsfiddle.net/sCvJk/

于 2013-03-30T02:38:49.277 に答える