Map distance measuring tool

Following the previous post, here is an example on how you will be able to use in the upcoming beta3 the polyline mouse handler to create a distance measuring tool.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
 xmlns:mx="http://www.adobe.com/2006/mxml"
 xmlns:utils="com.esri.aws.awx.utils.*"
 xmlns:framework="com.esri.aws.osgi.framework.*"
 xmlns:map="com.esri.aws.awx.map.*"
 layout="absolute"
 >
 <mx:Script>
  <![CDATA[
   import com.esri.aws.awx.utils.Utils;
   import com.esri.aws.awx.map.layers.overlays.Polyline;
   import com.esri.aws.awx.events.OverlayEvent;
   import com.esri.aws.awx.map.handlers.PolylineMouseHandler;
   import com.esri.aws.awx.map.handlers.IMouseHandler;

   private var m_mouseHandler : IMouseHandler;
  
   private function doMeasure() : void
   {
    m_mouseHandler = map.mouseHandler;
    var mouseHandler : PolylineMouseHandler = new PolylineMouseHandler( map.polylineLayer);
    mouseHandler.addEventListener(OverlayEvent.OVERLAY_CHANGED, function(event : OverlayEvent) : void
    {
     var polyline : Polyline = event.overlayObject as Polyline;
     var coords : Array = polyline.coords;
     var td : Number = 0.0;
     for( var i:int = 0, j:int=1; j<coords.length; i++, j++)
     {
      var p1 : Point = coords[i] as Point;
      var p2 : Point = coords[j] as Point;
      td += Utils.distVincenty(p1.y, p1.x, p2.y, p2.x);
     }
     distance.text = td.toFixed(2);
    });
    mouseHandler.addEventListener(OverlayEvent.OVERLAY_CREATED, function(event : OverlayEvent) : void
    {
     map.mouseHandler = m_mouseHandler;
    });
    map.mouseHandler = mouseHandler;
    distance.text = "0";
   }
  ]]>
 </mx:Script>
 <framework:Framework apiKey="19640523"/>
 <mx:Panel title="Measure Tool" width="100%" height="100%">
  <map:Map id="map"/> 
  <mx:ControlBar>
   <mx:Button label="Measure" click="doMeasure()"/>
   <mx:Button label="Clear" click="map.polylineLayer.removeAllOverlays()"/>
   <mx:Label text="Meters:"/>
   <mx:Label id="distance" text="0"/>
  </mx:ControlBar>
 </mx:Panel>
</mx:Application>