1 <!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN"
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3 <html xmlns=
"http://www.w3.org/1999/xhtml"
4 xmlns:
v=
"urn:schemas-microsoft-com:vml">
6 <meta http-equiv=
"content-type" content=
"text/html; charset=utf-8"/>
7 <title>Stop Mashup Coverage
</title>
8 <script src=
"http://maps.google.com/maps?file=api&v=2.x&key=local"
9 type=
"text/javascript"></script>
10 <script type=
"text/javascript">
13 // From the API examples:
14 // A Rectangle is a simple overlay that outlines a lat/lng bounds on the
15 // map. It has a border of the given weight and color and can optionally
16 // have a semi-transparent background color.
17 function Rectangle(bounds
, opt_weight
, opt_color
) {
18 this.bounds_
= bounds
;
19 this.weight_
= opt_weight
|| 2;
20 this.color_
= opt_color
|| "#888888";
22 Rectangle
.prototype = new GOverlay();
24 // Creates the DIV representing this rectangle.
25 Rectangle
.prototype.initialize = function(map
) {
26 // Create the DIV representing our rectangle
27 var div
= document
.createElement("div");
28 div
.style
.border
= this.weight_
+ "px solid " + this.color_
;
29 div
.style
.position
= "absolute";
31 // Our rectangle is flat against the map, so we add our selves to the
32 // MAP_PANE pane, which is at the same z-index as the map itself (i.e.,
33 // below the marker shadows)
34 map
.getPane(G_MAP_MAP_PANE
).appendChild(div
);
40 // Remove the main DIV from the map pane
41 Rectangle
.prototype.remove = function() {
42 this.div_
.parentNode
.removeChild(this.div_
);
45 // Copy our data to a new Rectangle
46 Rectangle
.prototype.copy = function() {
47 return new Rectangle(this.bounds_
, this.weight_
, this.color_
,
48 this.backgroundColor_
, this.opacity_
);
51 // Redraw the rectangle based on the current projection and zoom level
52 Rectangle
.prototype.redraw = function(force
) {
53 // We only need to redraw if the coordinate system has changed
56 // Calculate the DIV coordinates of two opposite corners of our bounds
57 // to get the size and position of our rectangle
58 var c1
= this.map_
.fromLatLngToDivPixel(this.bounds_
.getSouthWest());
59 var c2
= this.map_
.fromLatLngToDivPixel(this.bounds_
.getNorthEast());
61 // Now position our DIV based on the DIV coordinates of our bounds
62 this.div_
.style
.width
= Math
.abs(c2
.x
- c1
.x
) + "px";
63 this.div_
.style
.height
= Math
.abs(c2
.y
- c1
.y
) + "px";
64 this.div_
.style
.left
= (Math
.min(c2
.x
, c1
.x
) - this.weight_
) + "px";
65 this.div_
.style
.top
= (Math
.min(c2
.y
, c1
.y
) - this.weight_
) + "px";
71 if (GBrowserIsCompatible()) {
72 var map
= new GMap2(document
.getElementById("map"));
73 map
.addControl(new GLargeMapControl());
74 map
.addControl(new GMapTypeControl());
75 map
.setCenter(new GLatLng(45.43219, -75.691681), 11);
77 map
.addOverlay(new Rectangle(new GLatLngBounds(
78 new GLatLng(45.224854, -75.378571), // southwest
79 new GLatLng(45.519278, -75.941191) // northeast
82 debugel
= document
.getElementById("debug");
83 debugel
.innerHTML
= "blah";
84 GDownloadUrl("grabs/allsearched.xml", function(data
, responseCode
) {
85 debugel
.innerHTML
+= "<br/>here0";
86 var xml
= GXml
.parse(data
);
87 debugel
.innerHTML
+= "<br/>here1";
89 = xml
.documentElement
.getElementsByTagName("address");
90 debugel
.innerHTML
+= "<br/>here2: count " + addrs
.length
;
91 for (var i
= 0; i
< addrs
.length
; i
++) {
94 parseFloat(addrs
[i
].getAttribute("latitude")),
95 parseFloat(addrs
[i
].getAttribute("longitude")));
96 map
.addOverlay(new GMarker(point
));
105 <body onload=
"load()" onunload=
"GUnload()">
106 <div id=
"map" style=
"width: 800px; height: 600px"></div>
107 <div id=
"debug"></div>