How to dynamically measure and display radius of circle in OpenLayers?

Question

I want to give my user the ability to click on the map and give him a dynamic circle drawing tool which also reads out the radius measurement. That way the user can see how big the circle he creates is.

For example, something like this :

Any idea how I can add such a thing to OpenLayers?

Answer 1

I'd try this way:

• create a separate layer just for the radii,
• after each feature creation event on circle layer, construct a LINESTRING with two points: the center of the circle as start point and the easternmost vertex as end point, and calculate its length,
  • add this temporary feature to radii layer and label it with its length.

EDIT: I created a sample jsFiddle for this: http://jsfiddle.net/5TQHK/24/. Beware that if you use EPSG:900913, the calculated length will be too distorted to be useful. Use a local coordinate system or geodesic calculations to get meaningful length.

(I know that real circles don't have vertices, but in most GIS systems they do :) )