-1

webapp で、ajax を使用してページ (地図を含む googlemap.asp) を読み込んでいます。

jquery.load を使用して「googlemap.asp」を div にロードしていますが、左上隅に小さな地図しか表示されないため、div で設定したサイズ 320 x 600 になりません。この方法でロードすると、マップが正しくレンダリングされません。

しかし、「googlemap.asp」をブラウザに直接(ajaxなしで)ロードすると、正しく表示されるので、ajaxでロードするときに何らかの形でリフレッシュする必要があると思いますか?

これは私が持っているものです:

 <div id="map_canvas" style="height:600px; width:320px;" ></div>

window.onload=googleMaploadScript();


function googleMaploadScript() {
    var script =document.createElement("script");
    script.type="text/javascript";
    script.src="http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
    document.body.appendChild(script);  
    }

var address1 = document.getElementById('address').value;


var geocoder;
var map;
function initialize() {

  geocoder = new google.maps.Geocoder();
  var mapOptions = {
    zoom: 15,
    center: new google.maps.LatLng(57.109577,12.286513),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);  
  codeAddress(address1);

}

function codeAddress(address) {
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);

      var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location,
      });    
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });

}

どういうわけか間違った順序でロードしたと思います。それが正しくレンダリングされていない理由ですか、それとも開始時に div が表示されていない可能性がありますか?

ご意見ありがとうございます。

4

2 に答える 2

0

スクリプトから高さと幅を変更してみてください。

于 2013-06-10T08:06:35.440 に答える
0

中央に配置するには、このスクリプトをマップ スクリプトに追加すると、中央に配置されます。しかし、左上から中央に持ってくるのにも苦労しています。私の場合、向きやサイズを変更すると、マップがロードされて中央に配置されます

//センタリング用スクリプト

google.maps.event.addDomListener(window, "resize", function() {
                                var center = map.getCenter();
                                google.maps.event.trigger(map, "resize");
                                map.setCenter(center); 
                            });

動作するかどうか教えてください。詳細については、こちらのリンクをご覧ください

于 2014-06-11T12:31:16.010 に答える