purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

マーカーアイコンの変更

Google Mapsのマーカーを変更したいなと思った時のメモ

出来たもの

名古屋市 ZIP-FMでdemo

参考資料

GoogleMaps活用するぞ!(10) - マーカーを変えてみよう (SUZUMOTO HITOSHI'S BLOG)


ポイント

var icon = new GIcon();
icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
icon.iconSize = new GSize(12, 20);
icon.shadowSize = new GSize(22, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);


カスタマイズしたアイコン(本体と影)が置かれたURL(2・3行目)
アイコンの大きさ(4・5行目)
アイコンが定義された中心点に対して置かれる相対的位置(6行目)
そして(まだ出てきませんが)infoWindowが置かれる相対的位置(7行目)を定義しているのです

その他リンク

アイコン
Google Maps APIで使えるアイコン一覧|目で泳ぐ魚


リファレンス
GIcon