Thursday, September 13, 2007

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>

No comments: