Polygon in the form of a circle.

[sepoto]

I need to draw a circle and shade it to represent the radius map I am working with. Is this possible to do with api v3?

[Rossko]

> I need to draw a circle

http://code.google.com/apis/maps/documentation/javascript/overlays.html#Circles

[John Coryat]

Be aware that a circle will not define a radius properly. Since the map stretches the latitude in relation to the longitude, a circle will be (as a unit measurement) have different dimensions in the north-south direction as opposed to the east-west direction. If you want to represent a radius on the map, you'll need to use a polygon with correctly defined coordinates. Not difficult but harder than a plain circle.

The circle function (google.maps.Circle) doesn't handle this issue correctly. Circles should appear "egg" shaped on the map, especially at higher latitudes. Instead, they appear perfectly circular, so they are not truly defined by meters as the documentation states. 

This may not matter in your application but I suggest keeping it in mind in case you find your results are confusing.

-John Coryat

http://maps.huge.info

http://www.zipmaps.net

[Ben Appleton]

Hi John,

google.maps.Circle correctly handles radius. Large circles do appear "egg" shaped on the map as you describe.

Cheers

Ben

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/i4dKtBnKzaQJ.

To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

[John Coryat]

Ben,

http://maps.huge.info/test2.htm

This should be a hugely exaggerated circle but it's not.

Am I missing something?

-John Coryat

[Ben Appleton]

Hey John,

In a JS debugger I modified one of your circles' radii to 1000km and took a screenshot (attached). The resulting circle contains the North pole. It's clearly not a screen circle. Is this what you mean?

Cheers

Ben

--

You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/Z3LViM4wFuQJ.

[John Coryat]

Ben,

According to my calculations, it should look like this:

http://maps.huge.info/test2.htm

The circle is overlaid by what should be a more egg shaped polygon. This is an approximately 200 mile radius circle. Pardon the crudeness of the polygon. My math may be incorrect though.

-John

[John Coryat]

Ben,

I'm guessing by the look of the v3 function circle that there are less points involved in calculating the shape than I used. Except in extremely rare circumstances, like dealing with very high or low latitudes, your calculation would be indistinguishable from what I use.

-John

[Ben Appleton]

Hey John,

Interesting: I agree your circles differ from ours. We currently use 500 vertices, computing LatLng for each using google.maps.spherical.computeOffset:

http://code.google.com/apis/maps/documentation/javascript/reference.html#spherical
then projecting to pixel coordinates using the Map's projection (Google's Mercator).

We could have a bug, though I would have thought our tests would catch that. I'll have to look into it.

Thanks

Ben

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/4SKHhVbBlD0J.

[Karthik Reddy]

function getCirclePoints(center,radius){

var circlePoints = Array();

var searchPoints = Array();

var bounds = new google.maps.LatLngBounds();

with (Math) {

var rLat = (radius/3963.189) * (180/PI); // miles

var rLng = rLat/cos(center.lat() * (PI/180));

for (var a = 0 ; a < 361 ; a++ ) {

var aRad = a*(PI/180);

var x = center.lng() + (rLng * cos(aRad));

var y = center.lat() + (rLat * sin(aRad));

var point = new google.maps.LatLng(parseFloat(y),parseFloat(x),true);

circlePoints.push(point);

bounds.extend(point);

if (a % pointInterval == 0) {

searchPoints.push(point);

}

}

}

searchPolygon = new google.maps.Polygon({

paths: circlePoints, 

strokeColor: '#0000ff', 

strokeOpacity: 1, 

strokeWeight: 1, 

fillColor: '#0000ff', 

fillOpacity: 0.2

});

searchPolygon.setMap(map);

map.fitBounds(bounds);

//map.setCenter(searchPolygon.getBounds().getCenter(),map.getBoundsZoomLevel(searchPolygon.getBounds()));

return searchPoints;

}

[Enoch Lau]

If you calculate the distance from the circle's center LatLng to the manually calculated circle points (in cirCoords), you'll notice that they don't have a consistent distance - those manually calculated points don't form a circle.

[Enoch Lau]

This code calculates a circle in lat-lng space, which won't appear circular on-screen (using the mercator projection), nor is a spherical cap.

[f201...@dubai.bits-pilani.ac.in]

" var rLat = (radius/3963.189) * (180/PI)"

Can anyone explain how did we come up with this rlat formula

and what value does radius/earth's radius gives