shape raduis

[Daniel]

Hello

We are using shape to draw a "geo-fence" on a radmap.  we are ​currently passing a coordinate, along with a property of radius to the map.  The value of the radius property is a double representing meters.  so a 1 nautical mile = 1852 meters, so the geofence has a radius of ​926 meters

  

We have looked through all the samples and all the questions we can find in the forum, but we are not understanding what formula / calculation to use to draw this correctly on the map, and of course it needs to scale with zooming.  We have been attempting this in the shapeCreated(e) client event as below:  This of course draws a very large shape on the map.

 

function shapeCreated(e) {

if (e.shape.dataItem.properties.Radius) {

                var currentZoom = e.sender.zoom();
                var fenceRadius = e.shape.dataItem.properties.Radius;
                e.shape._geometry.radius = fenceRadius;
            }

}

 

Any direction on how to translate a shape based on radius meters (or other metric.. miles, feet, whatever) would be appreciated.

[Daniel]

Hello Folks...   

 Any help on this question ??

[Danail Vasilev]

Hello Daniel,

You should use "e.shape._geometry.setRadius" instead of "e.shape._geometry.radius". For example you can replace this method in the Map - Shapes Layer demo and you will get the desired behavior with the shapes enlargement when performing zoom:

e.shape._geometry.setRadius((parseFloat(mag) * parseFloat(mag) * parseFloat(mag)) * parseInt(currentZoom) / 30);

I will update the demo and the GeoJSON specifics in the context of RadMap article with this method as well.

I have also updated your Telerik points for helping us improve the quality of our online resources.

Regards,
Danail Vasilev
Telerik

[Daniel]

Hi Danail

Thanks for the reply and thank you very much for the points!!

I changed my ​function to implement setRadius and I can now set the size of my shape based on a parameter in my json properties.  However, I still have ​2 challenges..

1)  In the formula - (parseFloat(mag) * parseFloat(mag) * parseFloat(mag)) * parseInt(currentZoom) / 30) - 'mag' is from the properties "Magnitude" in your json (.i.e 2.6).  This does not appear to be related to specific distance of geography, but rather an arbitrary size based on the magnitude of an earth quake that allows the circles to maintain size in relation to each other, but not a specific distance of geography.

I need to show a circle based on a defined geographic distance.  I am passing in a desired raduis of meters (i.e a raduis of 1/2 mile or 926 meters).  if I pass in my radius of 926 meters, I end up with a circle that is much larger than a 1 nautical mile diameter when using your formula.

2) while the formula has the current zoom as a parameter, the circle does not maintain a correct of size based on a geographic distance... it occupies more geography or less geography as we zoom in or out.   This appears consistent in your demo as well.

 

Can you please explain the formula and provide an example that will provide a circle radius based on a geographic distance measurement (preferable meters, but I can calculate from any measurement), one that adjusts and maintains correct size based on zoom? 

[Daniel]

I took another direction and solved my problem.  It occured to me that what I really want is a polygon in the shape of a circle based on a radius from a point. 

Below is how I am creating a a list of poits to create a clean circle shape polygon based on n radius from the center point

var point = SqlGeography.Point(FenceLatitude.Value, FenceLongitude.Value, 4326);
var poly = point.BufferWithTolerance(fence.Raduis, 0.005, true);
StringBuilder polygonPoints = new StringBuilder();
for (int x = 1; x < poly.STNumPoints() + 1; x++)
{
     var pointN = poly.STPointN(x);
     if (x == 1)
           polygonPoints.Append(String.Format("[{0},{1}]", pointN.Long, pointN.Lat));
     else
           polygonPoints.Append(String.Format(",[{0},{1}]", pointN.Long, pointN.Lat));
}

HiddenGeoJSONPoints.Value = String.Format("[{{\"type\": \"Polygon\",\"coordinates\": [[{0}]],\"properties\":{{\"FenceType\":\"{1}\"}}}}]",  polygonPoints, FenceType);

 

The 0.005 in the BufferWithTolerance creates a number of Points in the list for the polygon to create a clean circle.  If performance proves an issue, dropping this to 0.01 will decrease the number of points, but maintain a "choppy" circle (3 for example create a triangle).