Sunday, November 16, 2008

Polygon and Geodetic Circle Draw Tool

In this sample, I'm demonstrating how to roll you own draw tool using the Flex API for ArcGISServer. I'm attaching mouse listeners to the map and based on the selected tool, I'm drawing a polyline, a circle or a geodetic circle. For the latter, I'm using the undocumented (subject to changes) ProjUtils class to enable me to calculate the distance in meters between two lat/lon values. In addition, this class has the capability to calculate a lat/lon value for a given lat/lon origin, radius and azimuth. When using this sample, watch out for boundary condition (too close to the poles or crossing the date line) as this is a very simple implementation. How to handle these conditions will be another post :-) as usual, you can download the source from here. Have fun, and hope to see some of you at MAX next week.

24 comments:

Anacaraka - Bali Unique Clothes said...

Wonderful
Why if I use draw circle and when i zoom in or zoom out the size of this circle isn't change.Not like if I use geodetic...

Regars,


Gus Leo

thunderhead said...

Because the Circle distance is based on pixel value, vs Geodetic is based on a "true" distance.

Anacaraka - Bali Unique Clothes said...

So how i can use Geodetic, because an error program because ProjUtils class isn't include..How i can get ProjUtils class???

Unknown said...

hi this is interesting. i'm trying to run your sample, but there are errors whether agslib-1.0-2008-10-22.swc or agslib-1.1-2009-01-21.swc
is used. would appreciate some advice on this?

thunderhead said...

I've updated the source code to include the Geodetic code - in addition, u need to get the flex api for ags swc from www.esri.com/flex. Hope that helps.

harry said...

how could i draw a circle with a specific value of radius.

for example what do i do to draw a circle with a radius of 5 km?

thunderhead said...

In this example, create a graphic with a circle geometry and a geodetic symbol. The circle geometry has a center x, y and a radius in meters.

harry said...

thanks for the help.
i have a few more questions,
you have used sprite.graphics.lineTo()

while in this example (http://arcgis.myclearwater.com/police/callsforservice)the polygon.addRing() method from the package com.esri.ags.geometry is used, what is the difference between the two?

thunderhead said...

The function addRing will add a set of map points to a polygon. When a symbol renders a polygon it will iterate over each ring and will use the flash graphic functions (moveTo, LineTo) to render that ring in pixel coordinate.

harry said...

thanks for the prompt reply.
im a newbie in gis/flex programming, so my questions might be naive. what i wanted to know is that what is the difference between these two approaches if we consider the GIS functionality like query tasks etc.

thunderhead said...

Sorry - not sure I understand the question :-( Questions are good from newbies :-)

harry said...

let me put it another way. why has ESRI made the geometry package in the ArcGIS API for Flex.
why not use the graphics functionality provided by flex Graphics class?

thunderhead said...

Ah - that is because we wanted to infer a map coordinate system through the class names, like MapPoint vs just Point and Extent vs Rectangle - in addition, we wanted to have the same naming convention as our JavaScript and Silverlight APIs

Asif said...

i have added text symbol in geodetic circle code
private var ts:TextSymbol = new TextSymbol("Testing",null,0x0000FF);
private var m_txtGraphics:Graphics;

.
.
.

m_txtGraphics = new Graphics(m_circleGeometry.center,ts);
graphicsLayer.add(m_txtGraphics);

but after executing the code when i zoom-in and zoom-out the map, the size of text should be changed accordingly like geodetic circles ... what should i do???

thunderhead said...

Write ur own custom text symbol that resizes the font size based on the map scale :-)

Asif said...
This comment has been removed by the author.
Asif said...

i am new to flex and GIS.Is it possible to give me a sample code or give me some guidance ...

Asif said...

I have to draw circles each with different color and line width. What should i change within this code.







Also i want to know, from where it is calling draw method of GeodeticSymbol?

thunderhead said...

1 - Create MyCircleSymbol that has public properties like color:Number and width:Number.
2 - In your main app, create MyCircleSymbol instance where u set different property values.
3 - To each "tool" - u can assign a previously created symbol dynamically - that will be associated with the generated graphic.
4 - We call the draw routine at the right time whenever the refresh function is invoked - to be more precise - refresh invalidates the display list - and draw is called in the update display list function.

gviz said...

The geodetic Utils class looks very useful. I see the geodeticInverse method allows me to get distance between two points, but I do not see a way to compute the azimuth(heading) between the two points--do you have some sample code that does that?

Asif said...

I have to draw a circular arc between two points. How can i do that and what changes should i made in this code?

thunderhead said...

Please look @ the GeodeticSymbol for sample usage

Asif said...

I have made following changes in GeodeticSymbol code.

while( ang < Maths.PI/4 )
{
ang += Utils.PI_OVER_180;
Utils.geodeticDirect( origPoint, circleGeometry.radius, ang, Utils.EARTH_RADIUS_IN_METERS, tempPoint );
sx = toScreenX( map, tempPoint.x * Utils.ONE_EIGHTY_OVER_PI );
sy = toScreenY( map, tempPoint.y * Utils.ONE_EIGHTY_OVER_PI );
sprite.graphics.lineTo( sx, sy );
}


Instead of drawing an arc of 45 degree, its draws semi circle ... But i don't want radii lines with the curve.

Tanya said...

HI I am trying to use the sample which you have provided..I need to display the radius of the circle while I draw the circle.

I am new to this technology,can u tell me how to go about it