숨겨진 div (jquery-ui 탭)의 Google지도 API V3

이 문제는 고대이지만, 명확한 지시를 찾을 수없는 것 같습니다.숨겨진 div (jquery-ui 탭)의 Google지도 API V3

문제의 요지는 Google지도가 숨겨진 (표시 : 없음) divs에로드 될 때 Google지도가 완전히로드되지 않는 것입니다 (부분적으로 표시됨). jQuery 탭 등

API V3는 checkResize()를 더 이상 허용하지 않습니다. 'left : -1000px'는 멋진 해결책이 아닙니다.

지도를 작성하는 데 지연이 있다고 들었지만 탭을 클릭 할 때지도를 새로 고침했지만 정확한 코드를 알려주세요.

2011-12-01 Rex

왜 "왼쪽 : -1000px '는 우아한 해결책이 아닙니까?? 그것은 나를 위해 API v2에서 크게 작동하며 API v3에서도 작동해야합니다 (테스트되지 않음, 작동하지 않는 경우 알려주십시오).

다시 그리기가, 즉 API v2를 checkResize()이 API v3의이 방법을 수행됩니다 :

.ui-tabs .ui-tabs-hide#my_tabs-1 { /* my_tabs-1 contains google map */ 
    display: block !important; 
    position: absolute !important; 
    left: -10000px !important; 
    top: -10000px !important; 
}

출처

2011-12-01 10:39:27 TMS

감사합니다. '-10000px'는 나에게 조금 해킹 된 것 같지만, 어쨌든 나는 그것을 줄 것이다. 감사!! – Rex

@Rex, 이제는 0을 추가 했으므로 이제는 우아합니다! :-) – TMS

@ Tomas 하하, 예, 작동합니다. 하지만 여전히지도를 만드는 것을 지연시키는 방법이나지도를 다시로드하는 방법을 알고 싶습니다. – Rex

: 여기

google.maps.event.trigger(map, 'resize');

은 ( http://jqueryui.com/demos/tabs/에서 영감) JQuery와 - UI 탭에 대한 내 CSS의 예입니다

Tab Show 이벤트에 의존 할 수없는 경우 페이지 준비에 initialize()을 호출하는 대신 Tab Link Click 이벤트에 이벤트를 추가 할 수 있습니다.

$('#TabLink').click(function() { 
    initialize(); 
});

출처

2012-03-26 16:07:17 msm2020

숨겨진 div (jquery-ui 탭)의 Google지도 API V3

답변

관련 문제