added support for ploylines and polygons on the google map

Polygons and polylines are read from the new file "regions.js". Polylines
(entries with "closed" set to false) are just lines drawn on the map.
Polygons (entries with "closed" set to true) are closed loops that are
filled in with a transparent color.

quadtree.py

@@ -128,11 +128,20 @@ class QuadtreeGen(object):
         with open(os.path.join(self.destdir, "index.html"), 'w') as output:
             output.write(html)
 
-        
-
+        # write out the default marker table
         with open(os.path.join(self.destdir, "markers.js"), 'w') as output:
             output.write("var markerData=%s" % json.dumps(self.world.POI))
 
+        # write out the default (empty, but documented) region table
+        with open(os.path.join(self.destdir, "regions.js"), 'w') as output:
+            output.write('var regionData=[\n');
+            output.write('  // {"color": "#FFAA00", "opacity": 0.5, "closed": true, "path": [\n')
+            output.write('  //   {"x": 0, "y": 0, "z": 0},\n')
+            output.write('  //   {"x": 0, "y": 10, "z": 0},\n')
+            output.write('  //   {"x": 0, "y": 0, "z": 10}\n')
+            output.write('  // ]},\n')
+            output.write('];');
+        
         # Write a blank image
         blank = Image.new("RGBA", (1,1))
         tileDir = os.path.join(self.destdir, "tiles")

template.html

@@ -8,6 +8,7 @@
   #mcmap { height: 100% }
 </style>
 <script type="text/javascript" src="markers.js"></script>
+<script type="text/javascript" src="regions.js"></script>
 <script type="text/javascript"
     src="http://maps.google.com/maps/api/js?sensor=false">
 </script>
@@ -155,6 +156,48 @@
    }
   }
   
+  var regionsInit = false;
+  function initRegions() {
+    if (regionsInit) { return; }
+    
+    regionsInit = true;
+    
+    for (i in regionData) {
+      var region = regionData[i];
+      var converted = new google.maps.MVCArray();
+      for (j in region.path) {
+        var point = region.path[j];
+        converted.push(fromWorldToLatLng(point.x, point.y, point.z));
+      }
+      
+      if (region.closed) {
+        new google.maps.Polygon({
+          clickable: false,
+          geodesic: false,
+          map: map,
+          strokeColor: region.color,
+          strokeOpacity: region.opacity,
+          strokeWeight: 2,
+          fillColor: region.color,
+          fillOpacity: region.opacity * 0.25,
+          zIndex: i,
+          paths: converted
+        });
+      } else {
+        new google.maps.Polyline({
+          clickable: false,
+          geodesic: false,
+          map: map,
+          strokeColor: region.color,
+          strokeOpacity: region.opacity,
+          strokeWeight: 2,
+          zIndex: i,
+          path: converted
+        });
+      }
+    }
+  }
+  
   function initialize() {
     var mapOptions = {
       zoom: config.defaultZoom,
@@ -187,8 +230,9 @@
     // We can now set the map to use the 'coordinate' map type
     map.setMapTypeId('mcmap');
 	
-	// initialize the markers
+	// initialize the markers and regions
 	initMarkers();
+    initRegions();
   }
 </script>
 </head>