Difference between revisions of "Range test"

From A.P.E.S. wiki
Jump to navigation Jump to search
 
(25 intermediate revisions by the same user not shown)
Line 20: Line 20:
 
       // GEOJSON FILES  
 
       // GEOJSON FILES  
 
       var hoolockhoolock = 'files/gibbon/Hoolock_hoolock.geojson';  
 
       var hoolockhoolock = 'files/gibbon/Hoolock_hoolock.geojson';  
        
+
       var hoolockleuconedys = 'files/gibbon/Hoolock_leuconedys.geojson';
 +
      var Nomascus_hainanus = 'files/gibbon/Nomascus_hainanus.geojson';
 +
 
 +
      // Create map
 
       var map = L.map('map').setView([10, 110], 4);  
 
       var map = L.map('map').setView([10, 110], 4);  
 +
 +
      // Create open maps
 +
      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);
 
       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 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) {
+
      // POPUP
        var popupContent = "<p><b>Species: </b>"+ feature.properties.BINOMIAL +'</p>';
+
       function forEachFeature(feature, layer) { var popupContent = "<p><b>Species: </b>"+ feature.properties.BINOMIAL +'</p>'; layer.bindPopup(popupContent);}
        layer.bindPopup(popupContent);
 
      }
 
  
 
       // Set style function that sets fill color property
 
       // Set style function that sets fill color property
 
+
       function stylehoolockhoolock(feature) {return { fillColor: 'purple',fillOpacity: 0.7,weight: 2,opacity: 0.7,color: 'purple',dashArray: '3', }; }
       function stylehoolockhoolock(feature) {
+
       function stylehoolockleuconedys(feature) {return { fillColor: 'red',fillOpacity: 0.7,weight: 2,opacity: 0.7,color: 'red',dashArray: '3', }; }
        return {
+
       function styleNomascus_hainanus(feature) {return { fillColor: 'blue',fillOpacity: 0.7,weight: 2,opacity: 0.7,color: 'blue',dashArray: '3', }; }
          fillColor: 'purple',  
 
          fillOpacity: 0.7,
 
          weight: 2,
 
          opacity: 0.7,
 
          color: 'purple',
 
          dashArray: '3',
 
        };
 
      }
 
 
 
       function stylehoolockleuconedys(feature) {
 
        return {
 
          fillColor: 'purple',  
 
          fillOpacity: 0.7,
 
          weight: 2,
 
          opacity: 0.7,
 
          color: 'purple',
 
          dashArray: '3',
 
        };
 
       }
 
  
 
       // Null variable that will hold layer
 
       // Null variable that will hold layer
 
       var hoolockhoolockLayer = L.geoJson(null, {onEachFeature: forEachFeature, style: stylehoolockhoolock});
 
       var hoolockhoolockLayer = L.geoJson(null, {onEachFeature: forEachFeature, style: stylehoolockhoolock});
 
       var hoolockleuconedysLayer = L.geoJson(null, {onEachFeature: forEachFeature, style: stylehoolockleuconedys});
 
       var hoolockleuconedysLayer = L.geoJson(null, {onEachFeature: forEachFeature, style: stylehoolockleuconedys});
 +
      var Nomascus_hainanusLayer = L.geoJson(null, {onEachFeature: forEachFeature, style: styleNomascus_hainanus});
 +
 +
      $.getJSON(hoolockhoolock, function(data) { hoolockhoolockLayer.addData(data);}); hoolockhoolockLayer.addTo(map);
 +
      $.getJSON(hoolockleuconedys, function(data) { hoolockleuconedysLayer.addData(data);}); hoolockleuconedysLayer.addTo(map);
 +
      $.getJSON(Nomascus_hainanus, function(data) { Nomascus_hainanusLayer.addData(data);});  Nomascus_hainanusLayer.addTo(map);
  
 
       // for Layer Control
 
       // for Layer Control
 
       var baseMaps = {
 
       var baseMaps = {
      "Open Street Map": osm, 
+
        "Open Street Map": osm, 
      "Open Topo Map": topo, 
+
        "Open Topo Map": topo, 
 
       };
 
       };
  
 +
      var overlayMaps = {
 +
        "Hoolock hoolock range": hoolockhoolockLayer,
 +
        "Hoolock leuconedys range": hoolockleuconedysLayer,
 +
        "Nomascus hainanus range": Nomascus_hainanusLayer,
 +
      };                  
 +
 +
      //Add layer control
 +
      L.control.layers(baseMaps, overlayMaps).addTo(map);
  
 
     </script>  
 
     </script>  
 
   </body>
 
   </body>
 
</html>
 
</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 10:07, 7 March 2022


Download available layers
Species Shapefile GeoJSON Source
Hoolock hoolock Hoolock hoolock shapefile (ZIP; 110 kB)]