Marker: new GIcon 復習

- コメント

オリジナルのアイコンで Google マップに個性を。そのおさらい。

たとえば Illustrator で線を引き、フィルタで手形の矢印を作って PSD に書き出して、

mano1 mano2

さらに Photoshop で寸法を整えたり加工したりして、GIF や JPG でなく PNG24 に書き出すと。

この例のアイコン画像の場合、サイズは幅36ピクセル、高さ80ピクセルなので、

iconSize = new GSize(36, 80);

という指定(「でかすぎ。」という声が聞こえるが、わざと巨大にした)。

mano5 mano4

ポイントの位置(画像では警視庁屋上ヘリポートの「H」中心)が iconAnchor。
このアイコン画像の場合、人差し指の先端が左下なので、

iconAnchor = new GPoint(4, 80);

左上カドから右へ4ピクセル、下へ80ピクセルの位置・・・としてみる。
そしてフキダシ(infoWindow)の指す尖った先端の位置が infoWindowAnchor。
たとえば手首の右端に指示してみる。

infoWindowAnchor = new GPoint(32, 1);

左上カドから右へ32ピクセル、下へ1ピクセルの位置、というふうな設定。

つまりアイコンの形や用途次第で、右や左、上や下に、好き勝手に工夫できるというあんばい。
実行例: 各アイコンのアンカー設定は、てんでばらばら。

新しいウィンドウで開く

アイコンにもシャドウがないとイヤ! なら、icon.shadowSize = new GSize(**, **); とか書くように。とグーグルのリファレンスは言ってます。
参考:テイクアウト用

mano  arrow  a-cup  b-cup  c-cup  rightbox  box  こちらにも少し。
「この記事が役に立ったという方は、 クリックを」・・・役に立ちませんね

最近の記事
横浜の防災地図(2012年5月18日)/ jqueryでinfoWindow代用(2012年5月12日)/ 4月の地震(2012年5月10日)/ Resizable Google Maps(2012年5月 9日)/ 全国の地下鉄路線図(2012年4月27日)/ Re: Google Maps API 3 + PHP + SimpleXML(2012年4月25日)/ addDomListener(2012年4月23日)/ アンダー・アーマー(2012年4月19日)/ 「カテゴリ」は必要か(2012年4月17日)/ PC買い替え(2012年4月15日)/ すべての記事一覧