From e2d2577d0659cf190340b642e364937b6887143b Mon Sep 17 00:00:00 2001 From: Anitra Griffin Date: Wed, 16 May 2018 11:01:32 -0400 Subject: [PATCH] updates visibilty toggle and nav bar aesthetics --- index.html | 182 +++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 149 insertions(+), 33 deletions(-) diff --git a/index.html b/index.html index 0191c3a..0c7efd6 100644 --- a/index.html +++ b/index.html @@ -1,45 +1,161 @@ + - - Add a WMS source - - - - + + Add a WMS source + + + + + + + +
+ + }, 'aeroway-taxiway'); //new layer + + map.addSource('na-asset-index', { + 'type': 'raster', + 'tiles': [ + 'https://gis.nemac.org/nfwf?bbox={bbox-epsg-3857}&format=image/png&service=WMS&version=1.1.1&request=GetMap&srs=EPSG:3857&width=256&height=256&layers=NA_AssetIndex' + ], + + 'tileSize': 256 + }); + + map.addLayer({ + 'id': 'NA Asset Index', + 'type': 'raster', + 'source': 'na-asset-index', + 'layout': { + 'visibility': 'none' + }, + 'paint': {} + }, 'aeroway-taxiway'); + }); //end of load map + + + var layerIds = ['NA Asset Index', 'NA Threat Index', 'NA Exposure Index']; + for (var i = 0; i < layerIds.length; i++) { + var id = layerIds[i]; + var url = document.createElement('a'); + url.href = '#'; + url.className = 'active'; + url.textContent = id; + + url.onclick = function(clicked) { + var currentLayer = this.textContent; + clicked.preventDefault(); + clicked.stopPropagation(); + + var visibility = map.getLayoutProperty(currentLayer, 'visibility'); + + if (visibility === 'visible') { + map.setLayoutProperty(currentLayer, 'visibility', 'none'); + this.className = ''; + } else { + this.className = 'active'; + map.setLayoutProperty(currentLayer, 'visibility', 'visible'); + } + }; + var layers = document.getElementById('menu'); + layers.appendChild(url); + } + +