Draggable Markers and GTileLayerOverlays

Thursday, August 10, 2006 at 11:53:00 AM

Revision 2.61 introduces 2 cool new features -- draggable markers and GTileLayerOverlays.

Draggable markers

We added draggable markers as a hidden feature in revision 2.46, but today they are making their official debut as part of the Maps API. To make a marker draggable, set the marker option draggable to true when you declare it: var marker = new GMarker(center, {draggable: true});.

When you drag the marker, a little X will appear to mark the spot where the marker will fall. After you let go of the marker, it bounces into place (to let you know how much fun it's having). If you prefer non-bouncy markers, set the marker option bouncy to false.

Try dragging this marker:


The Maps API has GTileLayers (which you can use to build GMapTypes) and GOverlays (which you can show on top of a Google Map). Today we're introducing GTileLayerOverlays, which lets you add tile layers without needing to introduce new map types. You can also add & remove them on the fly, unlike map types.

For example, to create a desaturated map, you can overlay it with a white tile overlay at 50% opacity:

 var tilelayer = new GTileLayer(new GCopyrightCollection(), 0, 17);
 tilelayer.getTileUrl = function(tile, zoom) {
   // A more interesting tile server would do something with the numbers
   // tile.x, tile.y and zoom.
   return "http://kml.lover.googlepages.com/white_map_tile.gif";
 tilelayer.getOpacity = function() {return 0.5;}
 map.addOverlay(new GTileLayerOverlay(tilelayer));

If you'd like to start testing these new features right away, don't forget to add the v=2.x parameter to your <script> src, so you get the latest revision instead of the default v2.60.

API v1 Current: 1.31
API v1 Default: 1.31
API v2 Current: 2.61
API v2 Default: 2.60