Difference between revisions of "Test"

@@ Line 1: / Line 1: @@
-<html>
-  <head>
-    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
-    <script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
-    <style>
-      #map {
-      height: 500px;
-      width: 100%;
-      max-width: 100%;
-      max-height: 100%;
-      }
-    </style>
-  </head>
-  <body>
-    <div id="map" style="width: 100%; height: 500px;"></div>
-    <script>
-    // GEOJSON FILES
-    var url = 'files/REFUGIA_MALEY96.json';  // my GeoJSON data source, in same folder as my html page.
-    var url2 = 'files/species_15933.geojson';  // my GeoJSON data source, in same folder as my html page.
-    var map = L.map('map').setView([47.7541, -107.05078], 3);
-    var topo=new L.tileLayer('http://{s}.tile.opentopomap.org/{z}/{x}/{y}.png',{
-    attribution: '&copy; <a href="http://osm.org/copyright">OpenTopoMap</a> contributors'}).addTo(map);
-    var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
-    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);
-    // Set style function that sets fill color property
-    function style(feature) {
-      return {
-        fillColor: 'green',
-        fillOpacity: 0.5,
-        weight: 2,
-        opacity: 1,
-        color: '#ffffff',
-        dashArray: '3'
-      };
-    }
-    function style2(feature) {
-      return {
-        fillColor: 'blue',
-        fillOpacity: 0.5,
-        weight: 2,
-        opacity: 1,
-        color: '#ffffff',
-        dashArray: '3'
-      };
-    }
-    function forEachFeature(feature, layer) {
-      var popupContent = "<p><b>STATE: </b>"+ feature.properties.STATE_NAME +
-                          "</br>REGION: "+ feature.properties.SUB_REGION +
-                          "</br>STATE ABBR: "+ feature.properties.STATE_ABBR +
-                          "</br>POP2010: "+ feature.properties.POP2010.toLocaleString() +
-                          "</br>Pop 2010 per SQMI: "+ feature.properties.POP10_SQMI.toLocaleString() +
-                          "</br>Males: "+ feature.properties.MALES.toLocaleString() +
-                          "</br>Females: "+ feature.properties.FEMALES.toLocaleString() +
-                          "</br>SQ Miles: "+ feature.properties.SQMI.toLocaleString() +'</p>';
-      layer.bindPopup(popupContent);
-    }
-    // Null variable that will hold layer
-    var stateLayer = L.geoJson(null, {style: style});
-    var stateLayer2 = L.geoJson(null, {style: style2});
-    $.getJSON(url, function(data) {
-    stateLayer.addData(data);
-    });
-    stateLayer.addTo(map);
-    $.getJSON(url2, function(data) {
-    stateLayer2.addData(data);
-    });
-    stateLayer2.addTo(map);
-    // for Layer Control
-    var baseMaps = {
-    "Open Street Map": osm,
-    "Open Topo Map": topo,
-    };
-    var overlayMaps = {
-    "USA":stateLayer,
-    "USAb":stateLayer2,
-    };
-    //Add layer control
-    L.control.layers(baseMaps, overlayMaps).addTo(map);
-    </script>
-  </body>
-</html>

Difference between revisions of "Test"

Latest revision as of 05:51, 29 September 2022

Navigation menu

Search