地図が表示されないんですけど…

Google Maps API v3 HTML

という事態が発生した。


Webチームが作っているサイトに、Google Mapsを組み込んだんだけど、どうも表示されないというのだ。
一応、ローカルでテストして問題なく表示されたコードを教えたんだけど、なぜか表示されない。


もしかしてクラスとかidがバッティングしてるとか？と思ってあれこれチェックしてたら…
どうも地図を表示させたいdivにサイズが指定されていないとダメらしい。
確かにチュートリアルやってるときには指定されたHTMLを写したりしてたし、自分で作る場合も真面目にサイズを指定してた。
ところがwebチームのページはwidthのみで、heightが指定されていなかったんだな。

おいおい、そんなことリファレンスに書いてあったっけ？と思って調べてみたら…

※注：地図は常にサイズをコンテナ要素から取得するため、 あなたは常に明示的に <div> にサイズを設定しなければなりません。

Google Maps API Version3 日本語ドキュメント(非公式): Google Maps API Version3 チュートリアル

Note that the map will always take its size from that of its containing element, so you must always set a size on that <div> explicitly.

Google Map Javascript API V3 Tutorial - Google Maps JavaScript API V3 - Google Code


僕が悪かったです。