こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

フォームの中でgoogleマップAPIの表示がずれてしまいます。教えてください

フォームの中でgoogleマップAPIの表示がずれてしまいます。教えてください

こんにちは、よろしくお願いします
<HEAD>
<script src="http://maps.google.com/maps?file=api&v=2&key=googleマップキー"
type="text/javascript" charset="utf-8"></script>
</HEAD>
<FORM>
<div id="default-open">
<a href="javascript:;" onclick="document.getElementById('default-close').style.display='block';
document.getElementById('default-open').style.display='none';">
オプションを追加する</a>
</div>
<div id="default-close" style="display: none;">
<a href="javascript:;" onclick="document.getElementById('default-open').style.display='block';
document.getElementById('default-close').style.display='none';">
閉じる</a><br>

<div id="map" style="width:300px; height:300px; margin-left: 0px; margin-top:0px;">
<script type="text/javascript">
//<![CDATA[

if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(36.033333, 139.15), 8);
}

//]]>
</script>
</div>
</FORM>
「オプションを追加する」をクリックしたら、javascriptで下側にgoogleマップAPIが現れるといったコンテンツを作っています
マップの表示はできるのですが、中のマップの表示がどうしてもずれたような感じになってしまいます

灰色の帯のようなものがマップの周囲に出てきて、きちんと読み込まれて無いように見えます
<div id="default-close">の外側に出すときちんと表示できるので、CSSで制御できないかと頑張ってみましたがうまくできません
上側の<div>タグで細工したのがずれる原因ではないかと思うのですが・・・
誰かこの問題について分かる方はいないでしょうか

投稿日時 - 2008-11-28 15:43:13

QNo.4513879

困ってます

質問者が選んだベストアンサー

var map = new GMap2(document.getElementById("map"), {size:new GSize(300,300)});
でだめですか?

投稿日時 - 2008-12-01 11:21:33

お礼

回答ありがとうございます。
できました!
後でネットで調べてみたらどうもあちこちで報告されてる現象のようですね
http://postal-search-apis-and-solutions.blogspot.com/2007/11/gmap2-optssize.html
http://googlemaps.googlermania.com/modules/d3forum/index.php?post_id=61
http://d.hatena.ne.jp/nitoyon/20050917/p2

javascriptで「display='none'」ってやって最初のアクセス時に非表示にしてると発生する怪現象みたいです

投稿日時 - 2008-12-01 11:48:38

ANo.1

このQ&Aは役に立ちましたか?

1人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問