Adjust active layers + refine menu
This commit is contained in:
parent
b610ecef54
commit
72f90fff47
13
index.html
13
index.html
@ -33,13 +33,20 @@
|
||||
<div class="main columns">
|
||||
<div class="column is-hidden" id="menu">
|
||||
<aside class="menu ml-4">
|
||||
<p class="menu-label">Siti indagati</p>
|
||||
<p class="menu-label">
|
||||
Siti indagati
|
||||
<button title="Chiudi menu" class="button is-small is-pulled-right" id="close-menu">
|
||||
<span class="icon is-small">
|
||||
<i class="fa fa-chevron-left"></i>
|
||||
</span>
|
||||
</button>
|
||||
</p>
|
||||
<ul class="menu-list">
|
||||
<li>
|
||||
<a class="button" id="gradola">
|
||||
<a class="button" title="Vai al sito Villa di Gradola" id="gradola">
|
||||
Villa di Gradola
|
||||
</a>
|
||||
<a class="button" id="matermania">
|
||||
<a class="button" title="Vai al sito Grotta di Matermania" id="matermania">
|
||||
Grotta di Matermania
|
||||
</a>
|
||||
<a class="button" id="arsenale">
|
||||
|
@ -9,7 +9,7 @@ import UI from "./ui.js";
|
||||
const GIS = {};
|
||||
|
||||
GIS.CENTER_COORDS = [40.5492, 14.2317];
|
||||
GIS.INIT_ZOOM = 14.5;
|
||||
GIS.INIT_ZOOM = 14;
|
||||
const optionsVincoli = {
|
||||
color: '#222',
|
||||
opacity: 0.8,
|
||||
@ -89,14 +89,21 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
||||
// TODO Horrible?
|
||||
return {map: map, sites: sitesGroup};
|
||||
}
|
||||
/**
|
||||
* Adds layers to map and returns an object
|
||||
* with {baseMap, archeoLayers, sitesLayerGroup}
|
||||
*
|
||||
* @param {L.Map} map
|
||||
* @returns {{baseMap: {"OpenStreetMap": L.TileLayer}, archeo: object, sitesGroup: L.LayerGroup}}
|
||||
*/
|
||||
GIS.initLayers = async function(map) {
|
||||
let layerMater = await this.loadLayer('matermania.geojson', optionsSiti, false);
|
||||
let layerArsenale = await this.loadLayer('arsenale_planim.geojson', optionsSiti, false);
|
||||
let layerArsenale = await this.loadLayer('arsenale.geojson', optionsSiti, false);
|
||||
let layerGradola = await this.loadLayer('gradola.geojson', optionsSiti, false);
|
||||
|
||||
layerMater.id = 'matermania';
|
||||
layerGradola.id = 'gradola';
|
||||
layerArsenale.id = 'arsenale_planim';
|
||||
layerArsenale.id = 'arsenale';
|
||||
let layerVincoli = await this.loadLayer('vincoli.geojson', optionsVincoli);
|
||||
// TODO named parameters??
|
||||
let layerPaesistici = await this.loadLayer('paesistici.geojson', optionsPaesistici);
|
||||
@ -107,11 +114,11 @@ GIS.initLayers = async function(map) {
|
||||
});
|
||||
|
||||
const sitesGroup = new L.LayerGroup([layerMater, layerGradola, layerArsenale]);
|
||||
const baseGroup = new L.LayerGroup([osmap, layerVincoli, layerPaesistici]);
|
||||
const baseGroup = new L.LayerGroup([osmap]);
|
||||
baseGroup.addTo(map);
|
||||
sitesGroup.addTo(map);
|
||||
const baseMap = {
|
||||
"Mappa di base (OpenStreetMap)" : osmap
|
||||
"OpenStreetMap" : osmap
|
||||
};
|
||||
const archeo = {
|
||||
"Villa di Gradola" : layerGradola,
|
||||
|
4
js/ui.js
4
js/ui.js
@ -97,8 +97,10 @@ UI.openModal = async function (data) {
|
||||
* @param {L.LayerGroup} sites
|
||||
*/
|
||||
UI.sitesMenu = function (menuListSel, map, sites) {
|
||||
const menu = document.querySelector(menuListSel);
|
||||
// Close menu if arrow button is clicked...
|
||||
this.toggleMenu('close-menu');
|
||||
|
||||
const menu = document.querySelector(menuListSel);
|
||||
menu.addEventListener('click', event => {
|
||||
if (event.target.nodeName === 'A') {
|
||||
// zoom to layer...
|
||||
|
Loading…
Reference in New Issue
Block a user