@@ 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 hoolockleuconedys = 'files/Hoolock_leuconedys.geojson';
-	var hoolocktianxing = 'files/Hoolock_tianxing.geojson';
-	var hyloabbotti = 'files/Hylobates_abbotti.geojson';
-	var hyloagilis = 'files/Hylobates_agilis.geojson';
-	var hyloalbibaris = 'files/Hylobates_albibarbis.geojson';
-	var hylofunereus = 'files/Hylobates_funereus.geojson';
-	var hylolar = 'files/Hylobates_lar.geojson';
-	var hylolarcarp = 'files/Hylobates_lar_ssp_carpenteri.geojson';
-	var hylolarvest = 'files/Hylobates_lar_ssp_vestitus.geojson';
-	var hylomoloch = 'files/Hylobates_moloch.geojson';
-	var hylomuell = 'files/Hylobates_muelleri.geojson';
-	var hylopileatus = 'files/Hylobates_pileatus.geojson';
-	var nomasannamensis = 'files/Nomascus_annamensis.geojson';
-	var nomasconcolor = 'files/Nomascus_concolor.geojson';
-	var nomasgabriellae = 'files/Nomascus_gabriellae.geojson';
-	var nomashainanus = 'files/Nomascus_hainanus.geojson';
-	var nomasleuco = 'files/Nomascus_leucogenys.geojson';
-	var nomasnasutus = 'files/Nomascus_nasutus.geojson';
-	var nomassiki = 'files/Nomascus_siki.geojson';
-	var symphasyndact = 'files/Symphalangus_syndactylus.geojson';
-    var hyloklosii = 'files/Hylobates_klossii.geojson';
-// Map
-	var map = L.map('map').setView([10, 110], 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);
-// Popup content
-	    function forEachFeature(feature, layer) {
-        var popupContent = "<p><b>Species: </b>"+ feature.properties.BINOMIAL +'</p>';
-        layer.bindPopup(popupContent);
-      }
-// Set style function that sets fill color property
-	  function stylehoolockhoolock(feature) {
-        return {
-          fillColor: 'F31818',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'F31818',
-          dashArray: '3'
-        };
-      }
-	  function stylehoolockleuconedys(feature) {
-        return {
-          fillColor: 'AF1818',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'AF1818',
-          dashArray: '3'
-        };
-      }
-	  function stylehoolocktianxing(feature) {
-        return {
-          fillColor: 'B65757',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'B65757',
-          dashArray: '3'
-        };
-      }
-	  function stylehyloabbotti(feature) {
-        return {
-          fillColor: 'F87446',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'F87446',
-          dashArray: '3'
-        };
-      }
-	  function stylehyloagilis(feature) {
-        return {
-          fillColor: 'CA833D',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'CA833D',
-          dashArray: '3'
-        };
-      }
-	  function stylehyloalbibaris(feature) {
-        return {
-          fillColor: 'CE6C0C',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'CE6C0C',
-          dashArray: '3'
-        };
-      }
-	  function stylehylofunereus(feature) {
-        return {
-          fillColor: 'EEA215',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'EEA215',
-          dashArray: '3'
-        };
-      }
-	  function stylehylolar(feature) {
-        return {
-          fillColor: 'EEC315',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'EEC315',
-          dashArray: '3'
-        };
-      }
-	  function stylehylolarcarp(feature) {
-        return {
-          fillColor: 'EBEE15',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'EBEE15',
-          dashArray: '3'
-        };
-      }
-	  function stylehylolarvest(feature) {
-        return {
-          fillColor: 'CCCE4A',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'CCCE4A',
-          dashArray: '3'
-        };
-      }
-	  function stylehylomoloch(feature) {
-        return {
-          fillColor: 'ADC60F',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'ADC60F',
-          dashArray: '3'
-        };
-      }
-	  function stylehylomuell(feature) {
-        return {
-          fillColor: '92C60F',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '92C60F',
-          dashArray: '3'
-        };
-      }
-	  function stylehylopileatus(feature) {
-        return {
-          fillColor: '7FDC14',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '7FDC14',
-          dashArray: '3'
-        };
-      }
-	  function stylenomasannamensis(feature) {
-        return {
-          fillColor: '4BDD0F',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '4BDD0F',
-          dashArray: '3'
-        };
-      }
-	  function stylenomasconcolor(feature) {
-        return {
-          fillColor: '0B8D1A',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '0B8D1A',
-          dashArray: '3'
-        };
-      }
-	  function stylenomasgabriellae(feature) {
-        return {
-          fillColor: '0FD29F',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '0FD29F',
-          dashArray: '3'
-        };
-      }
-	  function stylenomashainanus(feature) {
-        return {
-          fillColor: '0ECFB9',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '0ECFB9',
-          dashArray: '3'
-        };
-      }
-	  function stylenomasleuco(feature) {
-        return {
-          fillColor: '0CD1EA',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '0CD1EA',
-          dashArray: '3'
-        };
-      }
-	  function stylenomasnasutus(feature) {
-        return {
-          fillColor: '0995D4',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '0995D4',
-          dashArray: '3'
-        };
-      }
-	  function stylenomassiki(feature) {
-        return {
-          fillColor: '127BD6',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '127BD6',
-          dashArray: '3'
-        };
-      }
-	  function stylesymphasyndact(feature) {
-        return {
-          fillColor: '6740C6',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: '6740C6',
-          dashArray: '3'
-        };
-      }
-	 function styleshyloklosii(feature) {
-        return {
-          fillColor: 'EF1E6A',
-          fillOpacity: 0.7,
-          weight: 2,
-          opacity: 0.7,
-          color: 'EF1E6A',
-          dashArray: '3'
-        };
-      }
-// Null variable that will hold layer
-    var hoolockhoolockLayer = L.geoJson(null, {style: stylehoolockhoolock});
-	var hoolockleuconedysLayer = L.geoJson(null, {style: stylehoolockleuconedys});
-	var hoolocktianxingLayer = L.geoJson(null, {style: stylehoolocktianxing});
-	var hyloabbottiLayer = L.geoJson(null, {style: stylehyloabbotti});
-	var hyloalbibarisLayer = L.geoJson(null, {style: stylehyloalbibaris});
-	var hyloagilisLayer = L.geoJson(null, {style: stylehyloagilis});
-	var hylofunereusLayer = L.geoJson(null, {style: stylehylofunereus});
-	var hylolarLayer = L.geoJson(null, {style: stylehylolar});
-	var hylolarcarpLayer = L.geoJson(null, {style: stylehylolarcarp});
-	var hylolarvestLayer = L.geoJson(null, {style: stylehylolarvest});
-	var hylomolochLayer = L.geoJson(null, {style: stylehylomoloch});
-	var hylomuellLayer = L.geoJson(null, {style: stylehylomuell});
-	var hylopileatusLayer = L.geoJson(null, {style: stylehylopileatus});
-	var nomasannamensisLayer = L.geoJson(null, {style: stylenomasannamensis});
-	var nomasconcolorLayer = L.geoJson(null, {style: stylenomasconcolor});
-	var nomasgabriellaeLayer = L.geoJson(null, {style: stylenomasgabriellae});
-	var nomashainanusLayer = L.geoJson(null, {style: stylenomashainanus});
-	var nomasleucoLayer = L.geoJson(null, {style: stylenomasleuco});
-	var nomasnasutusLayer = L.geoJson(null, {style: stylenomasnasutus});
-	var nomassikiLayer = L.geoJson(null, {style: stylenomassiki});
-	var symphasyndactLayer = L.geoJson(null, {style: stylesymphasyndact});
-	var hyloklosiiLayer = L.geoJson(null, {style: stylehyloklosii});
-    $.getJSON(hyloklosii, function(data) { hyloklosiiLayer.addData(data);});
-      hyloklosiiLayer.addTo(map);
-	$.getJSON(hoolockhoolock, function(data) { hoolockhoolockLayer.addData(data);});
-      hoolockhoolockLayer.addTo(map);
-	$.getJSON(symphasyndact, function(data) { symphasyndactLayer.addData(data);});
-      symphasyndactLayer.addTo(map);
-	$.getJSON(nomassiki, function(data) { nomassikiLayer.addData(data);});
-      nomassikiLayer.addTo(map);
-	$.getJSON(nomasnasutus, function(data) { nomasnasutusLayer.addData(data);});
-      nomasnasutusLayer.addTo(map);
-	$.getJSON(nomasleuco, function(data) { nomasleucoLayer.addData(data);});
-      nomasleucoLayer.addTo(map);
-	$.getJSON(nomashainanus, function(data) { nomashainanusLayer.addData(data);});
-      nomashainanusLayer.addTo(map);
-	$.getJSON(nomasgabriellae, function(data) { nomasgabriellaeLayer.addData(data);});
-      nomasgabriellaeLayer.addTo(map);
-	$.getJSON(nomasconcolor, function(data) { nomasconcolorLayer.addData(data);});
-      nomasconcolorLayer.addTo(map);
-    $.getJSON(nomasannamensis, function(data) { nomasannamensisLayer.addData(data);});
-      nomasannamensisLayer.addTo(map);
-    $.getJSON(hylopileatus, function(data) { hylopileatusLayer.addData(data);});
-      hylopileatusLayer.addTo(map);
-    $.getJSON(hylomuell, function(data) { hylomuellLayer.addData(data);});
-      hylomuellLayer.addTo(map);
-    $.getJSON(hylomoloch, function(data) { hylomolochLayer.addData(data);});
-      hylomolochLayer.addTo(map);
-    $.getJSON(hylolarvest, function(data) { hylolarvestLayer.addData(data);});
-      hylolarvestLayer.addTo(map);
-	$.getJSON(hylolarcarp, function(data) { hylolarcarpLayer.addData(data);});
-      hylolarcarpLayer.addTo(map);
-    $.getJSON(hylolar, function(data) { hylolarLayer.addData(data);});
-      hylolarLayer.addTo(map);
-	$.getJSON(hylofunereus, function(data) { hylofunereusLayer.addData(data);});
-      hylofunereusLayer.addTo(map);
-    $.getJSON(hyloagilis, function(data) { hyloagilisLayer.addData(data);});
-      hyloagilisLayer.addTo(map);
-	$.getJSON(hyloalbibaris, function(data) { hyloalbibarisLayer.addData(data);});
-      hyloalbibarisLayer.addTo(map);
-	$.getJSON(hyloabbotti, function(data) { hyloabbottiLayer.addData(data);});
-      hyloabbottiLayer.addTo(map);
-	$.getJSON(hoolocktianxing, function(data) { hoolocktianxingLayer.addData(data);});
-      hoolocktianxingLayer.addTo(map);
-    $.getJSON(hoolockleuconedys, function(data) { hoolockleuconedysLayer.addData(data);});
-      hoolockleuconedysLayer.addTo(map);
-// for Layer Control
-    var baseMaps = {
-      "Open Street Map": osm,
-      "Open Topo Map": topo,
-      };
-    var overlayMaps = {
-      "Hoolock hoolock": hoolockhoolockLayer,
-	  "Hoolock leuconedys" : hoolockleuconedysLayer,
-	  "Hoolock tianxing" : hoolocktianxingLayer,
-	  "Hylobates abbotti" : hyloabbottiLayer,
-	  "Hylobates albibarbis" : hyloalbibarisLayer,
-	  "Hylobates agilis" : hyloagilisLayer,
-	  "Hylobates funereus" : hylofunereusLayer,
-	  "Hylobates lar" : hylolarLayer,
-	  "Hylobates lar carpenteri" : hylolarcarpLayer,
-	  "Hylobates lar vestitus" : hylolarvestLayer,
-	  "Hylobates moloch" : hylomolochLayer,
-	  "Hylobates muelleri" : hylomuellLayer,
-	  "Hylobates pileatus" : hylopileatusLayer,
-	  "Nomascus annamensis" : nomasannamensisLayer,
-	  "Nomascus concolor" : nomasconcolorLayer,
-	  "Nomascus gabriellae" : nomasgabriellaeLayer,
-	  "Nomascus hainanus" : nomashainanusLayer,
-	  "Nomascus leucogenys" : nomasleucoLayer,
-	  "Nomascus nasutus" : nomasnasutusLayer,
-	  "Nomascus siki" : nomassikiLayer,
-	  "Symphalangus syndactylus" : symphasyndactLayer,
-	  "Hylobates klosii" : hyloklosiiLayer,
-      };
-//Add layer control
-      L.control.layers(baseMaps, overlayMaps).addTo(map);
-    </script>
-  </body>
-</html>

Difference between revisions of "Seruyan-Sampit"

Latest revision as of 15:20, 4 March 2022

Navigation menu

Search