リキッドデザイン対策

KsGMap に関係なく、Google Maps API を用いた地図にそのまま組みこめる Tips です。


ブラウザのサイズに応じてマップのサイズを変更させる Tips です。
マップの幅をCSSで、% 指定しただけでは潜在的なバグがあります。

例えば、CSSで100%のマップを、横幅100px程度の大きさでブラウザを開き、次に1000px程度に広げます。マップの表示エリアはブラウザ幅と同じですが、実際にマップが表示される幅は400px程度です。
きちんとしたリキッドデザインにするのは、簡単でリサイズ後に専用のGoogle Maps APIの関数を実行するだけです。


サンプル



//ウィンドウをリサイズ時にGoogle Maps API自体もリサイズする

if( navigator.userAgent.match( "MSIE" ) ){ window.attachEvent( "onresize" , function(){ map.onResize(); } ); }

else if( navigator.userAgent.match( "Safari" ) ){ window.onresize = function(){ map.onResize(); }; }

else { window.addEventListener( "resize" , function(){ map.onResize(); } , false ); }

map.onResize(); の map は、GMap を定義する var map = new GMap( … の変数名を入れてください。
初期値のままの場合は、変更する必要はありません。


(この文章は、KsGMapオフィシャルサイトのTipsにも掲載しています)

公式ブログ誕生&関連記事

Google Maps API公式ブログ誕生
今まで、Google Maps APIの公式情報はGoogle-Maps-API-Groupを通して行われてきましたが、この度『Google Maps API Official Blog(英文)』が新たに作られました。
Groupは情報が埋もれやすいので、大変ありがたいです。



Googleローカル、オーナーが自由に登録可能に
Google Maps API とはあまり関係ありませんが、『Googleローカルに店舗の詳細追加、オーナーが情報を登録できるサービスも』(INTERNET Watch)によると、Google ローカルの情報ウィンドウに表示される情報を、オーナーが自由に登録することができるようになったとのこと。
また、従来はタウンページの住所や電話番号といった基本的な情報のみでしたが、ぐるなびるるぶ.comなどとも提携して、より多くの情報が表示されるとのことです。


なお、日本語版Google ローカルも、アメリカ版同様タブが採用されるようになりました。