npmap.js
Version:
A JavaScript web mapping library, built as a Leaflet plugin, for the National Park Service.
114 lines (111 loc) • 4 kB
HTML
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>ArcGIS Layer | Examples | NPMap.js</title>
<style>
body {
margin: 0;
padding: 0;
}
#map {
bottom: 0;
position: absolute;
top: 0;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var NPMap = {
div: 'map',
baseLayers: [{
attribution: 'Esri',
clickable: false,
tiled: true,
type: 'arcgisserver',
url: 'http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
}],
maxZoom: 13,
overlays: [{
/*
/*
http://mapservices.nps.gov/arcgis/rest/services/WildlandFire/FireOccurrence/FeatureServer
http://koop.dc.esri.com/github/colemanm/hurricanes/fl_2004_hurricanes/FeatureServer/0/query
http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Heritage_Trees_Portland/FeatureServer/0 (used in Esri Leaflet examples)
http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Trimet_Transit_Stops/FeatureServer/0
attribution: 'Esri',
name: 'Heritage Trees Portland',
type: 'arcgisserver',
url: 'http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Heritage_Trees_Portland/FeatureServer/0'
},{
*/
attribution: 'Esri',
layers: '2',
name: 'National Parks',
opacity: 0.5,
popup: {
description: {
fields: [
'PARKNAME',
'UNIT_TYPE'
],
format: 'table'
},
title: '{{PARKNAME}}'
},
tiled: false,
type: 'arcgisserver',
url: 'http://mapservices.nps.gov/arcgis/rest/services/LandResourcesDivisionTractAndBoundaryService/MapServer'
},{
attribution: 'Esri',
name: 'Hurricanes',
layers: '0,1',
opacity: 1,
popup: {
actions: '<ul><li><a href="#" onclick="window.alert(\'Clicked!\');return false;">Click Me</a></li></ul>',
description: function(data) {
if (typeof data.CAT === 'undefined') {
return '' +
'<table><tbody>' +
'<tr><td>Stage</td><td>{{STAGE}}</td></tr>' +
'<tr><td>Day</td><td>{{DAY}}</td></tr>' +
'<tr><td>Time</td><td>{{TIME}}</td></tr>' +
'<tr><td>Pressure</td><td>{{PRESSURE}}</td></tr>' +
'<tr><td>Wind Speed (Knots)</td><td>{{WINDSPEED}}</td></tr>' +
'</tbody></table>';
} else {
return '' +
'<table><tbody>' +
'<tr><td>Category</td><td>{{CAT}}</td></tr>' +
'<tr><td>Date</td><td>{{Date_date}}</td></tr>' +
'<tr><td>Start Time</td><td>{{Time}}</td></tr>' +
'<tr><td>End Time</td><td>{{EndTime}}</td></tr>' +
'<tr><td>Wind Speed (Knots)</td><td>{{WIND_KTS}}</td></tr>' +
'</tbody></table>';
}
},
title: function(data) {
if (typeof data.CAT === 'undefined') {
return data.EVENTID;
} else {
return data.NAME;
}
}
},
tiled: false,
type: 'arcgisserver',
url: 'http://sampleserver6.arcgisonline.com/arcgis/rest/services/Hurricanes/MapServer'
}]
};
(function() {
var s = document.createElement('script');
s.src = '../dist/npmap-bootstrap.js';
document.body.appendChild(s);
})();
</script>
</body>
</html>