Difference between revisions of "Range layers"

From A.P.E.S. wiki
Jump to navigation Jump to search
(Blanked the page)
Tag: Blanking
 
(44 intermediate revisions by the same user not shown)
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 hoolockhoolock = 'files/Hoolock_hoolock.geojson';
 
     
 
var map = L.map('map').setView([3, 100], 4);
 
 
      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);
 
 
 
 
  function forEachFeature(feature, layer) {
 
        var popupContent = "<p><b>BINOMIAL: </b>"+ feature.properties.binomial +
 
              "</br>BINOMIAL: "+ feature.properties.BINOMIAL +'</p>';
 
        layer.bindPopup(popupContent);
 
      }
 
      // Set style function that sets fill color property
 
 
function stylehoolockhoolock(feature) {
 
        return {
 
          fillColor: 'red',
 
          fillOpacity: 0.7, 
 
          weight: 2,
 
          opacity: 0.7,
 
          color: 'red',
 
          dashArray: '3'
 
        };
 
      }
 
      // Null variable that will hold layer
 
      var hoolockhoolockLayer = L.geoJson(null, {style: stylehoolockhoolock});
 
 
      $.getJSON(hoolockhoolock, function(data) { hoolockhoolockLayer.addData(data);});
 
      hoolockhoolockLayer.addTo(map);
 
 
      // for Layer Control
 
      var baseMaps = {
 
      "Open Street Map": osm, 
 
      "Open Topo Map": topo, 
 
      };
 
 
      var overlayMaps = {
 
      "Hoolock hoolock range": hoolockhoolockLayer,
 
      };
 
 
      //Add layer control
 
      L.control.layers(baseMaps, overlayMaps).addTo(map);
 
 
    </script>
 
  </body>
 
</html>
 
 
 
{|border="1" cellpadding="5" cellspacing="0" <!-- align="right" --> class="gibbon_ranges" !style="background-color:#ccffcc;"
 
|+'''Download available layers'''
 
!Species
 
!Shapefile
 
!GeoJSON
 
!Source
 
|-
 
|Hoolock hoolock
 
|[https://iucnapesportal.org/wiki/files/Hoolock_hoolock.zip ''Hoolock hoolock shapefile''] (ZIP; 110&nbsp;kB)]
 
|
 
|
 
|}
 

Latest revision as of 06:17, 8 March 2022