August 11, 2006 6:45 PM by ooi1

大井宏友です。

Google Mapsがまたまたバージョンアップし、マーカーをDragして位置を移動することが｢オフィシャルに｣ できるようになりました。

実はその機能を既に解説されているページがあるように、 少し前からこの機能は存在しました。が、原文を読むと、 どうも隠し機能だった様で、本日のバージョンアップv2.61でオフィシャルな機能になったようです。 

早速サンプルを作ってみました。

• Google Maps サンプル5::Draggable Marker

Drag対応は拍子抜けするほどカンタン

APIドキュメントやサンプルのソースを見ていただければお分かりかと思いますが、 MarkerをDrag対応するのはものすごくカンタンで、

var myMarker = new GMarker(point, {draggable: true});

と、GMarkerインスタンスを生成するときにdraggableプロパティをtrueにしてあげるだけ。これだけで、 Drag開始時にマーカーが持ち上がったりDrag終了時にマーカーがワンバウンドして着地するアニメーションつきでDragできるようになります。

またもしDrag開始時･終了時に何か処理を追加したいときは、 それぞれdragstart/dragendイベントを追加すればOK。

(8/12追記)ちなみにワンバウンドさせたくない場合は、

var myMarker = new GMarker(point, {draggable: true, bouncy: false});

と指定すればいいんですが、APIのドキュメントが間違っていて、何も指定しないときのbouncyのデフォルト値はtrueです。

さらに、バウンドの速度はbounceGravityプロパティで変更もできます。

ヒトは無意識のうちにDragしようとする!?

位置を指示したり登録したりするアプリケーションを作ってみたとき、 位置の微調整をしたいと思ったときにマーカーをDragしようとするヒトがいました。動かないことが分かっていても、 何回も同じようにDragしようとして、動かないことを再認識する。何となくですが、地図上のマーカーを見ていると、 人間は無意識のうちにDragできるものだと思ってしまうんでしょうかね。

確かに実際に今回のサンプルを作って動かしてみると、Dragして位置を変えるのが非常に気持ちいいし、自然に感じました。

tags：API  Google  Map  WEBサービス