WordPressにGoogle Maps API V3！

◆Google Maps API V3 のアイコン（マーカー）をスライドして移動可能にする。raiseOnDragの指定

移動可能なマーカー（アイコン）をドラッグ＆ドロップ（飛び跳ねるアニメーションでなく、スライドさせる指定です。（飛び跳ねるアニメーションの場合はコチラ）

スケートリンクを移動させるイメージですな。

マーカー（アイコン）をスライドで移動できるようにするためには、draggableだけでなく、raiseOnDrag指定する必要があります。

なお、日本語リファレンスには、載っていないので英語版からの紹介です。

google.maps.MarkerOptions object specification の Propertiesの中段に raiseOnDragの説明があります。draggable: trueとした上で、 raiseOnDrag: false,を指定します。

◆Script

var marker = new google.maps.Marker(

{

map: map,

draggable: true,

raiseOnDrag: false,

animation: google.maps.Animation.DROP,

position: latlng,

icon: icon.icon,

shadow: icon.shadow,

title: name

});

◆Google Maps JavaScript API V3　サンプル

• スライドアニメーションでアイコンを移動
• ドラッグ＆ドロップでアイコンを移動（おまけ）

◆参照先

• google.maps.MarkerOptions object specification の Properties

◆Google Maps JavaScript API V3

• Google Maps API v3 目次に戻る

スポンサードリンク