WEBサイト作成時に発生するエラーやトラブル対応の備忘録を中心に、いろいろと書いております。


display:noneのGoogleMapが表示したらズレる

,

管理画面で、地点を登録するときにGoogleMap上を直接たたいて緯度と経度を取得する仕組みを作成。
登録しなくてはならない地点が1点と2点のときがあって、1つの地図でその2つを登録できたらいいんだけど、よくわからないので1点目用と2点目用の地図を用意。
2点目まで登録するのはまれなので、普段は「display:none」でしまっておき、必要な時だけ「display:block;」で表示できるようにしていた。

このとき、「display:block」で表示したmapが左上にずれる。
……まぁ、わからないでもない。

調べていて参考にさせていただきましたー。

display:noneの要素にGoogle Mapsを貼り付ける

私の場合は、こんな感じかな
[javascript]
function HideCBox( boxid ) {
var target = document.getElementById(boxid);
if( target.style.display != "block" ) {
target.style.display = "block";
google.maps.event.trigger(map2, ‘resize’);
map2.setCenter(latlng2);
document.hidebutton.src = "files/close.gif";
}
else {
target.style.display = "none";
document.hidebutton.src = "files/open.gif";
}
}
[/javascript]

この
[javascript]
google.maps.event.trigger(map2, ‘resize’);
map2.setCenter(latlng2);
[/javascript]

という部分です。
target.style.display = “block”;
の後です。前だと同じようにずれるー。
表示してから、位置の修正ってことですかね。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください