Example 23 - Draggable Markers

As of version 2.46, you can drag markers on your map by simply specifying a draggable attribute for your marker tag. In addition to being draggable, you can now add two new event listeners to your markers, 'dragstart' and 'dragend' which are fired whenever a draggable marker is dragged.

Go ahead and drag the marker above. Each time you move it, you can then click and see a satellite blowup map of the area the marker is now pointing to.

Here's the code we used:

<googlemaps:map id="map" width="780" height="300" version="2" type="STREET">
  	<googlemaps:key domain="www.lamatek.com" key="Axxxxx"/>
  	<googlemaps:point id="point1" address="74 Connors Lane" city="Elkton" state="MD" 
  		zipcode="21921" country="US"/>
	<googlemaps:marker id="marker1" point="point1" draggable="true">
		<googlemaps:blowup maptype="satellite"/>
	</googlemaps:marker>
</googlemaps:map>  
  

Draggable markers only work on version 2 maps (version 2.46 or later).

Our next example demonstrates the new 'headless' feature for Google Maps.