first commit

2022-05-31 16:21:53 -04:00
commit f76abffdcd
5978 changed files with 1078901 additions and 0 deletions
@@ -0,0 +1,118 @@
+/* ------------------------------------------------------------------------------
+ *
+ *  # Circles
+ *
+ *  Specific JS code additions for maps_google_drawings.html page
+ *
+ * ---------------------------------------------------------------------------- */
+
+
+// Setup module
+// ------------------------------
+
+var GoogleMapDrawingCircles = function() {
+
+
+    //
+    // Setup module components
+    //
+
+    // Line chart
+    var _googleMapDrawingCircles = function() {
+        if (typeof google == 'undefined') {
+            console.warn('Warning - Google Maps library is not loaded.');
+            return;
+        }
+
+        // This example creates circles on the map, representing
+        // populations in North America.
+
+        // First, create an object containing LatLng and population for each city.
+        var citymap = {};
+        citymap['wroclaw'] = {
+            center: new google.maps.LatLng(51.112, 17.052),
+            population: 271485
+        };
+        citymap['budapest'] = {
+            center: new google.maps.LatLng(47.481, 19.130),
+            population: 840583
+        };
+        citymap['kernstadt'] = {
+            center: new google.maps.LatLng(51.720, 8.764),
+            population: 385779
+        };
+        citymap['nancy'] = {
+            center: new google.maps.LatLng(48.688, 6.173),
+            population: 603502
+        };
+        citymap['munich'] = {
+            center: new google.maps.LatLng(48.154, 11.541),
+            population: 594039
+        };
+        citymap['warsaw'] = {
+            center: new google.maps.LatLng(52.232, 21.061),
+            population: 492093
+        };
+
+        // Initialize
+        var cityCircle;
+        function initialize() {
+
+            // Define map element
+            var map_drawing_circles_element = document.getElementById('map_drawing_circles');
+
+            // Options
+            var mapOptions = {
+                zoom: 6,
+                center: new google.maps.LatLng(50.059, 14.465),
+                mapTypeId: google.maps.MapTypeId.TERRAIN
+            };
+
+            // Apply options
+            var map = new google.maps.Map(map_drawing_circles_element, mapOptions);
+
+
+            // Construct the circle for each value in citymap.
+            // Note: We scale the area of the circle based on the population.
+            for (var city in citymap) {
+
+                // Options
+                var populationOptions = {
+                    strokeColor: '#b41b1b',
+                    strokeOpacity: 0.5,
+                    strokeWeight: 1,
+                    fillColor: '#b41b1b',
+                    fillOpacity: 0.2,
+                    map: map,
+                    center: citymap[city].center,
+                    radius: Math.sqrt(citymap[city].population) * 100
+                };
+
+                // Add the circle for this city to the map.
+                cityCircle = new google.maps.Circle(populationOptions);
+            }
+        }
+
+        // Load map
+        google.maps.event.addDomListener(window, 'load', initialize);
+    };
+
+
+    //
+    // Return objects assigned to module
+    //
+
+    return {
+        init: function() {
+            _googleMapDrawingCircles();
+        }
+    }
+}();
+
+
+// Initialize module
+// ------------------------------
+
+document.addEventListener('DOMContentLoaded', function() {
+    GoogleMapDrawingCircles.init();
+});