jquery 마법사의 Google지도를 제대로로드 할 수 없습니다.

-1

마법사 양식으로 Google지도를 만들고 싶지만지도를 제대로로드 할 수없고 절반 만 표시 할 수 있습니다. 크기 조정을 시도했지만지도가 완전히 표시되지 않습니다. 감사합니다jquery 마법사의 Google지도를 제대로로드 할 수 없습니다.

<div class="row"> 
    <div class="col-sm-6"> 
     <div id="gmaps" style="width: 100%; height: 417px;"></div> 
    </div> 
</div>

응답 성이 뛰어난 부트 스트랩을 사용했습니다.

$(function() 
{ 
    $("#wizard").steps({ 
     headerTag: "h2", 
     bodyTag: "section", 
     transitionEffect: "slideLeft" 
    }); 
}); 


var map; 
function initialize() { 
    var mapOptions = { 
    zoom: 8, 
    center: new google.maps.LatLng(-34.397, 150.644) 
}; 
map = new google.maps.Map(document.getElementById('gmaps'), 
    mapOptions); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 
google.maps.event.addDomListener(window, "resize", resizingMap()); 
$('#wizard').on('changed.fu.wizard', function(){ 
    resizeMap(); 
}); 
function resizeMap(){ 
    if(typeof map == "undefined") return; 
    setTimeout(function(){resizingMap();} , 400); 
} 
function resizingMap(){ 
    if(typeof map == "undefined") return; 
    var center = map.getCenter(); 
    google.maps.event.trigger(map,"resize"); 
    map.setCenter(center); 
}

출처

2015-01-19 GemaLa Putri Mulgiati

가의 100 % 폭 무엇입니까? 포함 된 div가 있습니까? CSS가 필요 없으면 body와 html body, html {width : 100 %;}를 지정해야합니다. – geocodezip

예, 반응 형을 사용했기 때문입니다. 너비를 100 %로 설정했습니다. –

의 100 %는 무엇입니까? 특별히 정의하지 않으면 0의 100 %는 0입니다. – geocodezip

지도는 컨테이너의 픽셀 값을 사용하고 일부 경우/브라우저에서는 작동하지 않는다고 생각합니다. 어쩌면 부모 크기를 사용하여,

지도가 완전히로드

, 컨테이너의 크기를 업데이트

는이 같은 과거의 일을했다.

google.maps.event.addListenerOnce(map, 'idle', function(){ 
    // do something only the first time the map is loaded 
});

자세한 내용은이 읽기 : How can I check whether Google Maps is fully loaded?

출처

2015-01-19 11:39:03 Soley

jquery 마법사의 Google지도를 제대로로드 할 수 없습니다.

답변

관련 문제