July 30, 2008

Google Mapを使って(Google Map表示に使える)座標を取得するjQuery Pluginをcommitした

最近、地図としてGoogle Mapを表示させるようなWebシステムがあると思うのだけれども、それを表示させるには座標(緯度/経度)を設定しなければならない。面倒。

しかもいろんな場所を登録するようなシステムだった場合、その全ての座標をユーザに登録してもらう必要があって、それをユーザに求めるのは結構ユーザビリティ的にアウトだったりする。


で、その解決策として、Google Mapを使ってGoogle Mapを表示するための座標を取得するUIが考えられているのだけれども、作るのが結構面倒だったりする。


というわけで、もう面倒なのはイヤなのでjQuery Pluginを作ってみた。

んでもって、毎度のようにcodecheck.inにcommitした


とりあえずDEMOを見てもらえればどんなものか分かると思う。


DEMO


使い方としては、Google Mapを呼び出すトリガーとなる要素(#mapX)と、緯度(y)のinput要素(#mapY)と経度(x)のinput要素(#mapX)を指定するだけ。簡単。


$('#mapX').googlemap('#mapX','#mapY');


本当はjQuery UI Datepickerみたいにinput要素にfocusしたときにGoogle Mapを呼び出そうかとも思ったのだけれども地図ボタンとか作りたい人もいるかなと思ってclick時にGoogle Mapを呼び出すようにしてみた。

あ、デフォルトの座標はうちの会社のオフィスが入っているビル。
新オフィス快適過ぎる。


なんかいろいろ挙動が気にくわない人は是非ソースをいじって下さいな。
動作は今のところFirefoxでしか動かないみたい。
2重起動も制御できていないなあ。


追記

IE6,IE7に対応した。

トラックバックURL

http://trackback.blogsys.jp/livedoor/k1LoW/65080435

コメントする

名前:
URL:
  情報を記憶: 評価:  顔   星