My favorites | Sign in
Project Home Downloads Wiki Issues Source
Checkout   Browse   Changes    
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxSPW5CJgpdgO_s4yyMovOaVh_KvvhSfpvagV18eOyDWu7VytS6Bi1CWxw"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
// Taken from Kip, Modified by Pamela Fox & Dave Parsons
var map;

/**
* Add a circle to the global variable "map". This function won't work for circles that encompass
* the North or South Pole. Also, there is a slight distortion in the upper-left, upper-right,
* lower-left, and lower-right sections of the circle that worsens as it gets larger and/or closer
* to a pole.
* @param lat Latitude in degrees
* @param lng Longitude in degrees
* @param radius Radius of the circle in statute miles
* @param {String} strokeColor Color of the circle outline in HTML hex style, e.g. "#FF0000"
* @param strokeWidth Width of the circle outline in pixels
* @param strokeOpacity Opacity of the circle outline between 0.0 and 1.0
* @param {String} fillColor Color of the inside of the circle in HTML hex style, e.g. "#FF0000"
* @param fillOpacity Opacity of the inside of the circle between 0.0 and 1.0
*/
function drawCircle(lat, lng, radius, strokeColor, strokeWidth, strokeOpacity, fillColor, fillOpacity) {
var d2r = Math.PI/180;
var r2d = 180/Math.PI;
var Clat = radius * 0.014483; // Convert statute miles into degrees latitude
var Clng = Clat/Math.cos(lat*d2r);
var Cpoints = [];
for (var i=0; i < 33; i++) {
var theta = Math.PI * (i/16);
Cy = lat + (Clat * Math.sin(theta));
Cx = lng + (Clng * Math.cos(theta));
var P = new GLatLng(Cy, Cx);
Cpoints.push(P);
}

var polygon = new GPolygon(Cpoints, strokeColor, strokeWidth, strokeOpacity, fillColor, fillOpacity);
map.addOverlay(polygon);
}

function load() {
map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(53.479874, -2.246704), 9);
drawCircle(53.479874, -2.246704, 10.0, "#000080", 1, 0.75, "#0000FF",.5);
}
//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 650px; height: 500px"></div>
</body>
</html>

Change log

r2417 by pamela.fox on Sep 8, 2009   Diff
Fixing circle to use GLatLng
Go to: 
Project members, sign in to write a code review

Older revisions

r2416 by pamela.fox on Sep 8, 2009   Diff
Fixing circle to use GLatLng
r2091 by pamela.fox on May 4, 2008   Diff
Adding Daves circle fixes
r2090 by pamela.fox on May 4, 2008   Diff
Adding Daves circle fixes
All revisions of this file

File info

Size: 2662 bytes, 58 lines

File properties

svn:mime-type
text/html
Powered by Google Project Hosting