test.html

---
layout: city-gl
title: Seychelles
description:
permalink: /test/
zoom: 15
center-x: 55.46
center-y: -4.6
export: dfa5f3d2-b37c-4a51-9bb0-c00e788dd4db
---
<div id='intro'>
	<p>The majority of the Seychelles population is spread across three islands (Mahe, Praslin and La Digue). Because of the topography of the islands (flat coastal strips and/or plateaus rising into steep mountains towards the inner part of the island) many of the residential and commercial areas are located along the coast. These areas are prone to urban flooding, coastal erosion and coastal flooding. Urban flooding is a recurring problem that shows especially during the rainy season in December and January. Missing, under-dimensioned and poorly maintained drainage adds to the problem, in many districts.<br>
		While the flooding affects many sectors, the Open Cities Africa Seychelles Project is focusing on tourism. Tourism is the economic driver in the Seychelles,(next to fishing), and can be seriously impacted by the aforementioned hazards. Together with the Tourism Department and the Department for Disaster and Risk Management the Open Cities Africa Seychelles Project will collect data on tourism establishments and public buildings (schools, day-cares, etc.) located in the coastal areas (areas below 10m elevation) on the islands of Mahe, Praslin and La Digue.<br>
		Details to be collected include occupancy of the building, material, number of floors, whether the building is elevated, location of assembly points, etc. This will help the stakeholders to better understand and visualize risk and lead to more informed decisions at the various phases of disaster risk management e.g. to improve preparedness and plan for evacuation.<br>
		For the mapping and data collection activities the Project is engaging local communities (such as secondary school teachers and students) and building capacity within these communities. The Project will train community members on state-of-art geospatial technology that will enable them to collect/capture, analyze, visualize and share data for numerous purposes i.e. even beyond the scope of this project.</p>
</div>

	<div id="map"></div>
	<p><span id="aerial"></span> {% include download-data.html %}</p>

	{% include mapping-progress.html %}
	<iframe src="https://osm-analytics.org/#/compare/gist:a151b29ef0576cc1b1ecb2db4ab8c8e8/2018...now/buildings/embed/opendri" scrolling="no" width="100%" height="600" ></iframe>
	{% include data-quality.html %}
	<iframe src="https://osm-analytics.org/#/gaps/gist:a151b29ef0576cc1b1ecb2db4ab8c8e8/buildings-vs-ghs/embed/opendri" scrolling="no" width="100%" height="600" ></iframe>

<script>

	mapboxgl.accessToken = 'pk.eyJ1IjoicGFvbG9wYXNxdWFsaSIsImEiOiJoVU9zSE9VIn0.O8Cehs_li5LA2aLurdEDJQ';
	var map = new mapboxgl.Map({
	    container: 'map',
	    style: 'mapbox://styles/mapbox/streets-v11',
	    zoom: 10,
	    center: [55.46, -4.6]
	});

	map.on('load', function() {

	    map.addLayer({
	        'id': 'one',
	        'type': 'raster',
	        'source': {
	            'type': 'raster',
	            'tiles': [
	              'https://www.webgis.gov.sc/mapcache/tms/1.0.0/drone_imagery@Custom3857/{z}/{x}/{y}.png',
	            ],
							'scheme': 'tms',
	            'tileSize': 256
	        },
	        'layout': {
	            'visibility': 'none'
	        },
	        'paint': {}
	    }, '');
	});

	map.addControl(new mapboxgl.NavigationControl(),'top-left');
	map.dragRotate.disable();
	map.touchZoomRotate.disableRotation();
	map.scrollZoom.disable();


	toggleLayer(['one'], 'aerial');

	function toggleLayer(ids, name) {
	    var link = document.createElement('a');
	    link.href = '#';
	    link.className = 'button special';
	    link.textContent = 'View Aerial Imagery';

	    link.onclick = function (e) {
	        e.preventDefault();
	        e.stopPropagation();
	        for (layers in ids){
	            var visibility = map.getLayoutProperty(ids[layers], 'visibility');
	            if (visibility === 'visible') {
	                map.setLayoutProperty(ids[layers], 'visibility', 'none');
	                this.className = 'button special';
	                this.textContent = 'Hide Aerial Imagery';
	            } else {
	                this.className = 'button special';
	                map.setLayoutProperty(ids[layers], 'visibility', 'visible');
	                this.textContent = 'View Aerial Imagery';
	            }
	         }

	    };

	    var layers = document.getElementById('aerial');
	    layers.appendChild(link);
	}

</script>