Non puoi selezionare più di 25 argomenti
Gli argomenti devono iniziare con una lettera o un numero, possono includere trattini ('-') e possono essere lunghi fino a 35 caratteri.
1388 righe
53 KiB
1388 righe
53 KiB
2 anni fa
|
<?php
|
||
|
session_set_cookie_params(["SameSite" => "lax"]); //none, lax, strict
|
||
|
session_set_cookie_params(["Secure" => "true"]); //false, true
|
||
|
session_set_cookie_params(["HttpOnly" => "true"]); //false, true
|
||
|
//session_start();
|
||
|
?>
|
||
|
<?php if (session_id() == "")session_start();ob_start(); ?>
|
||
|
<?php include_once "cfg_srv.php" ?>
|
||
|
<?php include_once "routine_map_interventi.php" ?>
|
||
|
|
||
|
<!DOCTYPE html>
|
||
|
<html lang="it">
|
||
|
<head>
|
||
|
<meta charset="utf-8">
|
||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
|
<meta name="description" content="mapcloud è una piattaforma webgis in cloud in grado di erogare servizi cartografici alla Pubblica Amministrazione">
|
||
|
<meta name="author" content="mapcloud - mapping serviced">
|
||
|
<meta name="generator" content="Jekyll v3.8.5">
|
||
|
|
||
|
<title>Paesaggistica Sicilia</title>
|
||
|
|
||
|
<!-- Bootstrap core CSS -->
|
||
|
<link href="assets/css/bootstrap-italia.min.css" rel="stylesheet">
|
||
|
<link href="assets/fontawesome/css/all.css" rel="stylesheet" type="text/css" />
|
||
|
<link href="assets/css/docs.min.css" rel="stylesheet">
|
||
|
|
||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/leaflet/leaflet.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/sidebar/leaflet-sidebar.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/geocoder_190/Control.Geocoder.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/zoombar/src/L.Control.ZoomBar.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/measure/leaflet-measure.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/coord/Leaflet.Coordinates-0.1.5.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/home/leaflet.defaultextent.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/layertree/L.Control.Layers.Tree.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/sweetalert.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/fontawesome/css/leaflet.extra-markers.min.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/accordion/L.Control.AccordionLegend.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/markercluster/MarkerCluster.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/markercluster/MarkerCluster.Default.css" />
|
||
|
<link rel="stylesheet" href="assets/component/leaflet/loader/leaflet.loader.css" />
|
||
|
|
||
|
|
||
|
<style>
|
||
|
html, body, #map {
|
||
|
height: 100%;
|
||
|
padding: 0;
|
||
|
}
|
||
|
#map {cursor: default;}
|
||
|
|
||
|
.leaflet-container {background: #fff;outline: 0;}
|
||
|
|
||
|
.info {
|
||
|
position: absolute;
|
||
|
bottom: 5px;
|
||
|
left: 5px;
|
||
|
z-index: 400;
|
||
|
padding: 5px;
|
||
|
width: 20%;
|
||
|
font-family: Verdana, Tahoma, Helvetica, Arial, sans-serif;
|
||
|
font-size: 8pt;
|
||
|
background-color: rgba(255, 255, 255, 0.5);
|
||
|
box-shadow: 0 1px 5px rgba(0,0,0,0.65);
|
||
|
border-radius: 4px;
|
||
|
}
|
||
|
.leaflet-popup-content-wrapper {
|
||
|
width: 400px;
|
||
|
border-radius: 3px;
|
||
|
}
|
||
|
.leaflet-popup-content {
|
||
|
width: 350px!important;
|
||
|
}
|
||
|
table {
|
||
|
font-family: arial, sans-serif;
|
||
|
font-size: 11px;
|
||
|
border-collapse: collapse;
|
||
|
width: 350px!important;
|
||
|
}
|
||
|
caption {
|
||
|
background-color: #0059b3;
|
||
|
color: white;
|
||
|
padding: 5px;
|
||
|
}
|
||
|
th{
|
||
|
border: 1px solid #dddddd;
|
||
|
padding: 2px;
|
||
|
}
|
||
|
td{
|
||
|
border: 1px solid #dddddd;
|
||
|
padding: 2px;
|
||
|
}
|
||
|
|
||
|
tr:nth-child(odd) {
|
||
|
background-color: #E6E6E6;
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
|
||
|
<link rel="apple-touch-icon" href="assets/img/favicons/apple-icon.png">
|
||
|
<link rel="icon" href="assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
|
||
|
<link rel="icon" href="assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
|
||
|
<link rel="mask-icon" href="assets/img/favicons/safari-pinned-tab.svg" color="#0066CC">
|
||
|
<link rel="icon" href="favicon.ico">
|
||
|
<meta name="theme-color" content="#0066CC">
|
||
|
|
||
|
<!-- Twitter -->
|
||
|
<meta name="twitter:card" content="summary">
|
||
|
<meta name="twitter:site" content="@mapcloud">
|
||
|
<meta name="twitter:creator" content="Servizi cartografici in cloud">
|
||
|
<meta name="twitter:title" content="Info">
|
||
|
<meta name="twitter:description" content="mapcloud è una piattaforma webgis in cloud in grado di erogare servizi cartografici alla Pubblica Amministrazione">
|
||
|
|
||
|
<!-- Facebook -->
|
||
|
<meta property="og:url" content="https://www.mapcloud.it/">
|
||
|
<meta property="og:title" content="Informazioni">
|
||
|
<meta property="og:description" content="mapcloud è una piattaforma webgis in cloud in grado di erogare servizi cartografici alla Pubblica Amministrazione">
|
||
|
<meta property="og:type" content="website">
|
||
|
|
||
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||
|
<script>
|
||
|
// Disabilita tracciamento se il cookie cookies_consent non esiste
|
||
|
if (document.cookie.indexOf('cookies_consent=true') === -1) {
|
||
|
window['ga-disable-UA-96051960-1'] = true;
|
||
|
}
|
||
|
</script>
|
||
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-96051960-1"></script>
|
||
|
<script>
|
||
|
window.dataLayer = window.dataLayer || [];
|
||
|
function gtag(){dataLayer.push(arguments);}
|
||
|
gtag('js', new Date());
|
||
|
|
||
|
gtag('config', 'UA-96051960-1', { 'anonymize_ip': true });
|
||
|
</script>
|
||
|
|
||
|
</head>
|
||
|
|
||
|
<body>
|
||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||
|
<div class="container">
|
||
|
<span class="skiplink-text">Skip to main content</span>
|
||
|
</div>
|
||
|
</a>
|
||
|
<!-- MODAL -->
|
||
|
|
||
|
|
||
|
<div class="container-fluid">
|
||
|
<div class="row flex-xl-nowrap">
|
||
|
<!-- FINE HEADER -->
|
||
|
|
||
|
<script src="assets/js/jquery-3.3.1.min.js"></script>
|
||
|
<script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet-src.js" crossorigin=""></script>
|
||
|
<script src="assets/component/leaflet/sidebar/leaflet-sidebar.js"></script>
|
||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js"></script>
|
||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4leaflet/1.0.2/proj4leaflet.js"></script>
|
||
|
<script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>
|
||
|
<script src="assets/component/leaflet/zoombar/src/L.Control.ZoomBar.js"></script>
|
||
|
<script src="assets/component/leaflet/print/leaflet.browser.print.js"></script>
|
||
|
<script src="assets/component/leaflet/print/leaflet.browser.print.utils.js"></script>
|
||
|
<script src="assets/component/leaflet/print/leaflet.browser.print.sizes.js"></script>
|
||
|
<script src="assets/component/leaflet/measure/leaflet-measure.js"></script>
|
||
|
<script src="assets/component/leaflet/coord/Leaflet.Coordinates-0.1.5.min.js"></script>
|
||
|
<script src="assets/component/leaflet/home/leaflet.defaultextent.js"></script>
|
||
|
<script src="assets/component/leaflet/layertree/L.Control.Layers.Tree.js"></script>
|
||
|
<script src="assets/component/leaflet/sweetalert.js"></script>
|
||
|
<script src="assets/component/leaflet/shp/catiline.js"></script>
|
||
|
<script src="assets/component/leaflet/shp/leaflet.shpfile.js"></script>
|
||
|
<script src="assets/component/leaflet/hash/leaflet-hash.js"></script>
|
||
|
<script src="assets/component/leaflet/fontawesome/js/leaflet.extra-markers.js"></script>
|
||
|
<script src="assets/component/leaflet/accordion/L.Control.AccordionLegend.js"></script>
|
||
|
<script src="assets/component/leaflet/markercluster/leaflet.markercluster.js"></script>
|
||
|
<script src="assets/component/leaflet/loader/leaflet.loader.js"></script>
|
||
|
|
||
|
<style>
|
||
|
#map { height: calc(100vh); box-sizing: border-box; }
|
||
|
</style>
|
||
|
|
||
|
<!-- BEGIN MAP BODY -->
|
||
|
|
||
|
<!-- BODY -->
|
||
|
<main class="col-12" style="padding-right: 0px;padding-left: 0px;">
|
||
|
|
||
|
<!-- BEGIN SIDEBAR -->
|
||
|
<div id="sidebar" class="sidebar collapsed">
|
||
|
<!-- NAV TABS -->
|
||
|
<div class="sidebar-tabs">
|
||
|
<ul role="tablist">
|
||
|
<li><a href="#home" role="tab"><i class="far fa-layer-group fa-lg" style="margin-top:5px;margin-left:5px"></i></a></li>
|
||
|
<?php if ($_SESSION['STATUS'] == 'true' ) {?>
|
||
|
<li><a href="draw" role="tab"><i class="far fa-map-location-dot fa-lg" style="margin-top:5px;margin-left:5px"></i></a></li>
|
||
|
<?php } ?>
|
||
|
<li><a href="#guide" role="tab"><i class="fas fa-question fa-lg" style="margin-top:5px;margin-left:5px"></i></a></li>
|
||
|
<li><a href="#info" role="tab"><i class="fal fa-info-circle fa-lg" style="margin-top:5px;margin-left:5px"></i></a></li>
|
||
|
</ul>
|
||
|
</div>
|
||
|
|
||
|
<!-- Tab panes -->
|
||
|
<div class="sidebar-content">
|
||
|
<div class="sidebar-pane" id="home">
|
||
|
<h1 class="sidebar-header">Livelli cartografici<span class="sidebar-close"><i class="fal fa-arrow-alt-right" style="margin-top:1px;"></i></span></h1>
|
||
|
</div>
|
||
|
|
||
|
<div class="sidebar-pane" id="guide">
|
||
|
<h1 class="sidebar-header">Guida<span class="sidebar-close"><i class="fal fa-arrow-alt-right" style="margin-top:10px;"></i></span></h1>
|
||
|
<br>
|
||
|
<div class="row">
|
||
|
<div class="col"><img src="assets/img/bar_zoom+.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 10px"><b>Zoom +</b>: aumenta il livello di dettaglio della mappa</div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><img src="assets/img/bar_zoom-.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 10px"><b>Zoom +</b>: diminuisce il livello di dettaglio della mappa</div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><img src="assets/img/bar_measure.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 3px;">Strumento per misurare linee ed aree con la possibilità<br>di effettuare lo zoom sulla misura disegnata</div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><img src="assets/img/bar_home.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 10px;">Torna alla visualizzazione su tutto il territorio comunale</div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><img src="assets/img/bar_location.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 0px;">Ricerca sulla toponimastica attraverso l'inserimento dell'indirizzo completo, per esempio:<br><strong>Via Roma 12, Siracusa</strong></div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><img src="assets/img/bar_print.png" width="34" height="33" alt=""/></div>
|
||
|
<div class="col-10" style="margin-top: 0px;">Stampa la visualizzazione della mappa potendo<br>scegliere tra:
|
||
|
<ul>
|
||
|
<li> Stampa orizzontale (A4)</li>
|
||
|
<li> Stampa verticale (A4)</li>
|
||
|
<li> Stampa automatica in funzione della<br>risoluzione dello schermo</li>
|
||
|
<li> Stampa finestra (A4)</li>
|
||
|
</ul></div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><i class="far fa-layer-group fa-15x" style="margin-top:12px;margin-left:8px;font-size: 24px"></i></div>
|
||
|
<div class="col-10" style="margin-top: 15px;">Visualizza i livelli cartografici</div>
|
||
|
</div>
|
||
|
<div class="row" style="margin-top: 18px;">
|
||
|
<div class="col"><i class="far fa-list-alt fa-15x" style="margin-top:12px;margin-left:8px;font-size: 24px"></i></div>
|
||
|
<div class="col-10" style="margin-top: 15px;">Visualizza la legenda</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div class="sidebar-pane" id="info">
|
||
|
<h1 class="sidebar-header">Info<span class="sidebar-close"><i class="fal fa-arrow-alt-right" style="margin-top:10px;"></i></span></h1>
|
||
|
<br>
|
||
|
<div class="row" style="margin-top: 40px">
|
||
|
<div class="col-12" style="text-align:center; margin-right: 20px"><img src="assets/img/powered_by.svg" height="65px" alt=""/><br><br>info@reportaus.com
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- END SIDEBAR -->
|
||
|
|
||
|
<!-- MODAL LEGENDA -->
|
||
|
<div class="modal it-dialog-scrollable fade" tabindex="-1" role="dialog" id="legendainfo" aria-labelledby="legendainfo">
|
||
|
<div class="modal-dialog modal-dialog-right" role="document">
|
||
|
<div class="modal-content">
|
||
|
<div class="modal-header">
|
||
|
<h5 class="modal-title">Legenda</h5>
|
||
|
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
||
|
<svg class="icon">
|
||
|
<use xlink:href="assets/img/sprite.svg#it-close"></use>
|
||
|
</svg>
|
||
|
</button>
|
||
|
</div>
|
||
|
<div class="modal-body">
|
||
|
|
||
|
</div>
|
||
|
<div class="modal-footer">
|
||
|
<button class="btn btn-primary btn-sm" type="button" data-dismiss="modal">Chiudi</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- MODAL LEGENDA -->
|
||
|
|
||
|
<!-- MODAL WMSINFO -->
|
||
|
<div class="modal it-dialog-scrollable fade" tabindex="-1" role="dialog" id="wmsinfo" aria-labelledby="wmsinfo">
|
||
|
<div class="modal-dialog modal-dialog-right" role="document">
|
||
|
<div class="modal-content">
|
||
|
<div class="modal-header">
|
||
|
<h5 class="modal-title"><i class="far fa-info-circle fa-lg" style="margin-top:12px;margin-left:5px"></i> INFO</h5>
|
||
|
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
||
|
<svg class="icon">
|
||
|
<use xlink:href="assets/img/sprite.svg#it-close"></use>
|
||
|
</svg>
|
||
|
</button>
|
||
|
</div>
|
||
|
<div class="modal-body">
|
||
|
|
||
|
</div>
|
||
|
<div class="modal-footer">
|
||
|
<button class="btn btn-primary btn-sm" type="button" data-dismiss="modal">Chiudi</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- MODAL WMSINFO -->
|
||
|
|
||
|
<!-- MODAL JSON -->
|
||
|
<div class="modal it-dialog-scrollable fade" tabindex="-1" role="dialog" id="featureModal" aria-labelledby="exampleModalLabel">
|
||
|
<div class="modal-dialog modal-dialog-right" role="document">
|
||
|
<div class="modal-content">
|
||
|
<div class="modal-header">
|
||
|
<h5 class="modal-title" id="feature-title"></h5>
|
||
|
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
||
|
<svg class="icon">
|
||
|
<use xlink:href="assets/img/sprite.svg#it-close"></use>
|
||
|
</svg>
|
||
|
</button>
|
||
|
</div>
|
||
|
<div class="modal-body" id="feature-info">
|
||
|
|
||
|
</div>
|
||
|
<div class="modal-footer">
|
||
|
<button class="btn btn-primary btn-sm" type="button" data-dismiss="modal">Chiudi</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- MODAL JSON -->
|
||
|
|
||
|
<!-- MAP -->
|
||
|
<div id="map" class="sidebar-map" style="z-index:10;"></div>
|
||
|
|
||
|
<script>
|
||
|
init();
|
||
|
function init() {
|
||
|
//var url = "https://test-paesaggistica.lavoripubblici.sicilia.it/geoserver/mappers/wms",
|
||
|
var url = "/geoserver/mappers/wms",
|
||
|
|
||
|
services = {layer1_name:{title:"layer1_title",properties:{property1_name:"property1_title",property2_name:"property2_title"}},},
|
||
|
geojson,
|
||
|
|
||
|
|
||
|
// ########### BEGIN LEYERS LIST ###########
|
||
|
|
||
|
odm1 = L.tileLayer ('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||
|
{
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
attribution: 'OpenStreetMap | contributors CC-BY-SA.'
|
||
|
}),
|
||
|
|
||
|
|
||
|
odm2 = L.tileLayer ('https://{s}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey=fb41522c8c244d489bc7843bac313f4a',
|
||
|
{
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
attribution: 'OpenCycleMap | © OpenStreetMap'
|
||
|
}),
|
||
|
|
||
|
|
||
|
odm5 = L.tileLayer ('http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
|
||
|
{
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
attribution: '© Esri | Source: Esri, USDA, USGS, AEX, GeoEye and the GIS User Community'
|
||
|
}),
|
||
|
|
||
|
|
||
|
odm6 = L.tileLayer.wms (url,
|
||
|
{
|
||
|
maxZoom: 20,
|
||
|
minZoom: 5,
|
||
|
transparent: true,
|
||
|
layers: 'mappers:limiti_comunali',
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
|
||
|
|
||
|
ctr2k = L.tileLayer.wms ('http://map.sitr.regione.sicilia.it/gis/services/CART_2000/CTN_2000/MapServer/WMSServer',
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 14,
|
||
|
transparent: true,
|
||
|
layers: '2,4,5,6,9,10,11,12,13,14,15,22',
|
||
|
attribution: 'Carta Tecnica Terionale 1:2.000 WGS84 - Regione Sicilia (Servizio WMS)'
|
||
|
}),
|
||
|
|
||
|
ctr10k = L.tileLayer.wms ('http://map.sitr.regione.sicilia.it/gis/services/CTR_10000/CTR_1000_2013_Mosaico/MapServer/WMSServer',
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 14,
|
||
|
transparent: true,
|
||
|
layers: '0,1,2',
|
||
|
attribution: 'Carta Tecnica Regionale 1:10.000 - Regione Sicilia (Servizio WMS)'
|
||
|
}),
|
||
|
|
||
|
orto0708 = L.tileLayer.wms ('http://map.sitr.regione.sicilia.it/ArcGIS/services/Ortofoto_ATA20072008/MapServer/WMSServer',
|
||
|
{
|
||
|
format: 'image/jpeg',
|
||
|
transparent: true,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
layers: '0',
|
||
|
attribution: 'Ortofoto ATA 2007-2008 - Regione Sicilia (Servizio WMS)'
|
||
|
}),
|
||
|
|
||
|
ortoagea = L.tileLayer.wms ('http://map.sitr.regione.sicilia.it/ArcGIS/services/CACHED/ortofoto_agea2010_webmercatore/MapServer/WMSServer',
|
||
|
{
|
||
|
format: 'image/jpeg',
|
||
|
transparent: true,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
layers: '0',
|
||
|
attribution: 'Ortofoto Regione Siciliana AGEA 2010 - Regione Sicilia (Servizio WMS)'
|
||
|
}),
|
||
|
|
||
|
orto1213 = L.tileLayer.wms ('http://map.sitr.regione.sicilia.it/gis/services/ATA_2012_2013/Ortofoto_ATA_2012_2013/MapServer/WMSServer',
|
||
|
{
|
||
|
format: 'image/jpeg',
|
||
|
transparent: true,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 1,
|
||
|
transparent: true,
|
||
|
layers: '0',
|
||
|
attribution: 'Ortofoto ATA 2012-2013 - Regione Sicilia (Servizio WMS)'
|
||
|
}),
|
||
|
|
||
|
clc18 = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:clc18',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 7,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
class_sismica = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:class_sismica2022',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 7,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
|
||
|
zoning = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_zoning',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
/*
|
||
|
urba75 = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:vincoli_<?php // echo $_SESSION['COMUNE_BELF']; ?>',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
*/
|
||
|
|
||
|
|
||
|
partic = L.tileLayer.wms(url, {
|
||
|
layers: "mappers:particelle_<?php echo $_SESSION['COMUNE_BELF']; ?>",
|
||
|
format: "image/png",
|
||
|
maxZoom: 20,
|
||
|
minZoom: 10,
|
||
|
transparent: true,
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
partic_modificate = L.tileLayer.wms(url, {
|
||
|
layers: "mappers:particelle_modificate",
|
||
|
format: "image/png",
|
||
|
maxZoom: 20,
|
||
|
minZoom: 10,
|
||
|
transparent: true,
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
particelle = L.layerGroup([partic, partic_modificate]),
|
||
|
|
||
|
|
||
|
regimi_normativi = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_regimi_normativi'
|
||
|
}),
|
||
|
|
||
|
v_1497 = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_1497',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_archeo = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_archeo',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_boschi = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_boschi',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_costa = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_costa',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_fiumi = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_fiumi',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_interesse_archeo = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_interesse_archeo',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_laghi = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_laghi',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_lettera_c = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_lettera_c',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_riserve = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_riserve',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_parchi = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_parchi',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_1200 = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_1200',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
v_vulcano = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.6,
|
||
|
layers: 'mappers:<?php echo $_SESSION['COMUNE_PROV']; ?>_v_vulcano',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180],
|
||
|
attribution: '© mapcloud services'
|
||
|
}),
|
||
|
|
||
|
pai_geo_rischio = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_geo_rischio',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_geo_pericolo = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_geo_pericolo',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_geo_sa = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_geo_sa',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_geo_dissesti_att = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_geo_dissesti_att',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_geo_dissesti_tipo = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_geo_dissesti_tipo',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_idro_rischio = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_idro_rischio',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_idro_pericolo = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_idro_pericolo',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
pai_idro_sa = L.tileLayer.wms (url,
|
||
|
{
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
layers: 'mappers:pai_idro_sa',
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
tiled: true,
|
||
|
tilesorigin: [-180, 180]
|
||
|
}),
|
||
|
|
||
|
|
||
|
|
||
|
vincidro = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 2,
|
||
|
layers: 'mappers:sif_vincolo_idrogeo'
|
||
|
}),
|
||
|
|
||
|
|
||
|
vinc227 = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 2,
|
||
|
layers: 'mappers:cfsr_dl227'
|
||
|
}),
|
||
|
|
||
|
vinc96 = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
layers: 'mappers:cfrs_lr16'
|
||
|
}),
|
||
|
|
||
|
vincsiczps = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
layers: 'mappers:sic_zps'
|
||
|
}),
|
||
|
|
||
|
vincriserve = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
layers: 'mappers:riserve'
|
||
|
}),
|
||
|
|
||
|
sin = L.tileLayer.wms (url, {
|
||
|
format: 'image/png',
|
||
|
transparent: true,
|
||
|
opacity: 0.5,
|
||
|
maxZoom: 20,
|
||
|
minZoom: 8,
|
||
|
layers: 'mappers:sin'
|
||
|
}),
|
||
|
|
||
|
|
||
|
|
||
|
//################# Overlay Layers #################
|
||
|
highlight = L.geoJson(null),
|
||
|
//################# Overlay Layers #################
|
||
|
|
||
|
//################# INIZIO LIMITE COMUNALE #################
|
||
|
limite_comune = L.geoJson(null, {
|
||
|
style: {'color': "#0000ff",'fillColor': "0000ff",'fillOpacity': 0,'weight': 2,'opacity': 0.6}
|
||
|
});
|
||
|
$.getJSON("data/<?php echo $_SESSION['COMUNE_BELF'] ?>_limite_comune.json", function(data) {
|
||
|
limite_comune.addData(data);
|
||
|
}),
|
||
|
//################# FINE LIMITE COMUNALE #################
|
||
|
|
||
|
//################# INIZIO PARTICELLA SELEZIONATA #################
|
||
|
<?php if ( strlen($_SESSION['SELECT_PARTICELLA']) > 150 ) { ?>
|
||
|
particella = L.geoJson(<?php echo $_SESSION['SELECT_PARTICELLA'];?>, {
|
||
|
style: {'color': "#ff0000",'fillColor': "rgb(255, 255, 0)",'fillOpacity': 0.4,'dashArray': 4,'weight': 3,'opacity': 0.9}
|
||
|
}),
|
||
|
|
||
|
<?php } ?>
|
||
|
//################# FINE PARTICELLA SELEZIONATA #################
|
||
|
|
||
|
//################# INIZIO INTERVENTI #################
|
||
|
int_polygon = L.geoJson(<?php echo $_SESSION['INT_POLYGON'];?>, {
|
||
|
style: {'color': "#001AFF",'fillColor': "#00C3FF5B",'fillOpacity': 0.4,'weight': 3,'opacity': 0.9},
|
||
|
onEachFeature: function(feature, layer) {
|
||
|
console.log(feature.properties);
|
||
|
content = "<br><table class='table table-striped table-bordered' width='100%'>" +
|
||
|
"<tr><th width='30%'>Note alla geometria</th><td>" + feature.properties.notes + "</td></tr><table>";
|
||
|
layer.bindTooltip(content);
|
||
|
}
|
||
|
}),
|
||
|
|
||
|
int_line = L.geoJson(<?php echo $_SESSION['INT_LINE'];?>, {
|
||
|
style: {'color': "#001AFF",'fillOpacity': 1,'weight': 3,'opacity': 0.9},
|
||
|
onEachFeature: function(feature, layer) {
|
||
|
console.log(feature.properties);
|
||
|
content = "<br><table class='table table-striped table-bordered' width='100%'>" +
|
||
|
"<tr><th width='30%'>Note alla geometria</th><td>" + feature.properties.notes + "</td></tr><table>";
|
||
|
layer.bindTooltip(content);
|
||
|
}
|
||
|
}),
|
||
|
|
||
|
int_point = L.geoJson(<?php echo $_SESSION['INT_POINT'];?>, {
|
||
|
pointToLayer: function (feature, latlng) {
|
||
|
return L.marker(latlng, {
|
||
|
icon: L.icon({
|
||
|
iconUrl: "assets/img/marker.svg",
|
||
|
iconSize: [24, 28],
|
||
|
iconAnchor: [12, 28],
|
||
|
popupAnchor: [0, -25]
|
||
|
})
|
||
|
});
|
||
|
},
|
||
|
onEachFeature: function(feature, layer) {
|
||
|
console.log(feature.properties);
|
||
|
content = "<br><table class='table table-striped table-bordered' width='100%'>" +
|
||
|
"<tr><th width='30%'>Note alla geometria</th><td>" + feature.properties.notes + "</td></tr><table>";
|
||
|
layer.bindTooltip(content);
|
||
|
}
|
||
|
}),
|
||
|
//################# FINE INTERVENTI #################
|
||
|
|
||
|
//################# INIZIO MARKER #################
|
||
|
<?php if ( strlen($_SESSION['SELECT_PARTICELLA']) < 150 ) { ?>
|
||
|
marker = L.marker([<?php echo $_SESSION['LAT'].", ". $_SESSION['LONG'];?>]);
|
||
|
<?php $actlayer = ",marker"; } ?>
|
||
|
//################# FINE MARKER #################
|
||
|
|
||
|
map = L.map("map", {
|
||
|
center: [<?php echo $_SESSION['CENTER'];?>],
|
||
|
zoom: <?php echo $_SESSION['ZOOM'];?>,
|
||
|
minZoom: 10,
|
||
|
maxZoom: 19,
|
||
|
attributionControl: false,
|
||
|
zoomControl: true,
|
||
|
measureControl: true,
|
||
|
defaultExtentControl: true,
|
||
|
maxBounds: L.latLngBounds([<?php echo $_SESSION['BOUND']; ?>]).pad(0.5),
|
||
|
<?php if ( strlen($_SESSION['SELECT_PARTICELLA']) > 150 ) { ?>
|
||
|
layers: [odm1, limite_comune, particella, int_polygon, int_line, int_point, particelle<?php echo $actlayer;?>] })
|
||
|
<?php } else { ?>
|
||
|
layers: [odm1, limite_comune<?php echo $actlayer;?>] })
|
||
|
<?php } ?>
|
||
|
|
||
|
|
||
|
var geocoder = L.Control.geocoder({position: "topleft"}).addTo(map);
|
||
|
|
||
|
var baseTree = [
|
||
|
|
||
|
{label: '<b>Opendata Map</b>', noShow: false, children: [
|
||
|
{label: 'OpenStreetMap', layer: odm1 },
|
||
|
{label: 'OpenCycleMap', layer: odm2 },
|
||
|
{label: 'Satellite Image', layer: odm5 },
|
||
|
{label: 'Limiti comunali', layer: odm6 },
|
||
|
]},
|
||
|
{label: '<b>Cartografia Regionale</b>', children: [
|
||
|
{label: 'CTR 2K - volo 2003-2004', layer: ctr2k },
|
||
|
{label: 'CTR 10K - volo 2012-2013', layer: ctr10k },
|
||
|
{label: 'Ortofoto ATA 2007-2008', layer: orto0708 },
|
||
|
{label: 'Ortofoto AGEA 2010', layer: ortoagea },
|
||
|
{label: 'Ortofoto ATA 2012-2013', layer: orto1213 },
|
||
|
]},
|
||
|
];
|
||
|
|
||
|
var overlaysTree =
|
||
|
{
|
||
|
label: '<b>TEMI DELL\'AMMINISTRAZIONE</b>',
|
||
|
noShow: true,
|
||
|
children: [
|
||
|
|
||
|
{label: '<b>Dati generali</b>', children: [
|
||
|
{label: 'CORINE Land Cover (IV Livello)', layer: clc18 },
|
||
|
{label: 'Classificazione Sismica 2022', layer: class_sismica },
|
||
|
]},
|
||
|
|
||
|
{label: '<b>Localizzazione Interventi</b>', children: [
|
||
|
{label: 'Interventi areali', layer: int_polygon },
|
||
|
{label: 'Interventi lineari', layer: int_line },
|
||
|
{label: 'Interventi point', layer: int_point },
|
||
|
]},
|
||
|
|
||
|
{label: '<b>Catasto</b>', children: [
|
||
|
{label: 'Particelle catastali', layer: particelle },
|
||
|
]},
|
||
|
|
||
|
{label: '<b>Strumenti Urbanistici</b>', children: [
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="zoning" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> PRG nodi SITR', layer: zoning },
|
||
|
]},
|
||
|
|
||
|
|
||
|
{label: '<b>Vincoli BBCCAA</b>', children: [
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="regimi_normativi" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a> Regimi Normativi', layer: regimi_normativi },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art136" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a> Aree tutelate <br><span style="margin-left:30px"></span><i>art.136, D.lgs.42/04</i>', layer: v_1497 },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142m" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a> Aree di interesse archeologico <br><span style="margin-left:30px"></span><i> art.142, lett. m, D.lgs.42/04</i>', layer: v_archeo },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142g" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree boscate <br><span style="margin-left:30px"></span><i> art.142, lett. g, D.lgs.42/04</i>', layer: v_boschi },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142a" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree costa 300m <br><span style="margin-left:30px"></span><i> art.142, lett.a, D.lgs. 42/04</i>', layer: v_costa },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142c" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree fiumi 150m <br><span style="margin-left:30px"></span><i> art.142, lett. c, D.lgs.42/04</i>', layer: v_fiumi },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art10d" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Vincoli Archeologici <br><span style="margin-left:30px"></span><i> art.10 D.lgs. 42/04</i>', layer: v_interesse_archeo },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142b" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree laghi 300m <br><span style="margin-left:30px"></span><i> art.142, lett. b, D.lgs. 42/04</i>', layer: v_laghi },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art134c" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree tutelate <br><span style="margin-left:30px"></span><i> art.134, lett. c, D.lgs. 42/04</i>', layer: v_lettera_c },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142f" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree riserve regionali <br><span style="margin-left:30px"></span><i> art.142, lett. f, D.lgs.42/04</i>', layer: v_riserve },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="art142f2" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Parchi regionali <br><span style="margin-left:30px"></span><i> art.142, lett. f, D.lgs.42/04</i>', layer: v_parchi },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="v1200" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Aree al di sopra di 1200m</i>', layer: v_1200 },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="vvulcano" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Vincolo area vulcanica</i>', layer: v_vulcano },
|
||
|
]},
|
||
|
|
||
|
{label: '<b>PAI</b>', children: [
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_geo_rischio" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Geomorfologia - Rischio', layer: pai_geo_rischio },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_geo_pericolo" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Geomorfologia - Pericolosità', layer: pai_geo_pericolo },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_geo_sa" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Geomorfologia - Siti di Attenzione', layer: pai_geo_sa },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_geo_dissesti_att" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Geomorfologia - Dissesti per attività', layer: pai_geo_dissesti_att },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_geo_dissesti_tipo" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Geomorfologia - Dissesti per tipologia', layer: pai_geo_dissesti_tipo },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_idro_rischio" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Idraulica - Rischio Idraulico', layer: pai_idro_rischio },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_idro_pericolo" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Idraulica - Pericolosità Idraulica', layer: pai_idro_pericolo },
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="pai_idro_sa" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> Idraulica - Siti Attenzione', layer: pai_idro_sa },
|
||
|
]},
|
||
|
|
||
|
{label: '<b>Regimi Vincolistici Sicilia</b>', children: [
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="vidrog" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Vincolo Idrogeologico', layer: vincidro },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="dl227" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Carta Forestale - def. DLgs 227-01', layer: vinc227 },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="lr96" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Carta Forestale - def. LR 19-96', layer: vinc96 },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="sic_zps" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-right:px"></i></a> SIC - ZPS', layer: vincsiczps },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="riserve" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>Riserve', layer: vincriserve },
|
||
|
|
||
|
{label: '<a class="legendainfo" data-toggle="modal" data-target="#modallegenda" data-id="sin" href="#"><i class="far fa-list-alt fa-lg" style="margin-top:12px;margin-left:5px;margin-right:5px"></i></a>SIN', layer: sin },
|
||
|
]},
|
||
|
]
|
||
|
}
|
||
|
|
||
|
$(document).ready(function(){
|
||
|
$('.legendainfo').click(function(){
|
||
|
var legendaid = $(this).data('id');
|
||
|
// AJAX request
|
||
|
$.ajax({
|
||
|
url: 'legenda.php',
|
||
|
type: 'post',
|
||
|
data: {legendaid: legendaid},
|
||
|
success: function(response){
|
||
|
// Add response in Modal body
|
||
|
$('.modal-body').html(response);
|
||
|
// Display Modal
|
||
|
$('#legendainfo').modal('show');
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
});
|
||
|
|
||
|
// ########### BEGIN POPUP
|
||
|
map.on("popupclose", function (e) {
|
||
|
if (geojson) {
|
||
|
map.removeLayer(geojson);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
map.on("click", function (e) {
|
||
|
|
||
|
var _layers = this._layers,
|
||
|
layers = [],
|
||
|
versions = [],
|
||
|
styles = [];
|
||
|
|
||
|
for (var x in _layers) {
|
||
|
var _layer = _layers[x];
|
||
|
if (_layer.wmsParams) {
|
||
|
layers.push(_layer.wmsParams.layers);
|
||
|
versions.push(_layer.wmsParams.version);
|
||
|
styles.push(_layer.wmsParams.styles);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
var loc = e.latlng,
|
||
|
xy = e.containerPoint, // xy = this.latLngToContainerPoint(loc,this.getZoom())
|
||
|
size = this.getSize(),
|
||
|
bounds = this.getBounds(),
|
||
|
crs = this.options.crs,
|
||
|
sw = crs.project(bounds.getSouthWest()),
|
||
|
ne = crs.project(bounds.getNorthEast()),
|
||
|
obj = {
|
||
|
service: "WMS", // WMS (default)
|
||
|
version: versions[0],
|
||
|
request: "GetFeatureInfo",
|
||
|
layers: layers,
|
||
|
styles: styles[0],
|
||
|
bbox: sw.x + "," + sw.y + "," + ne.x + "," + ne.y, // works with both EPSG4326, EPSG3857
|
||
|
width: size.x,
|
||
|
height: size.y,
|
||
|
query_layers: layers,
|
||
|
info_format: "application/json", // text/plain (default), application/json for JSON (CORS enabled servers), text/javascript for JSONP (JSONP enabled servers)
|
||
|
feature_count: 5 // 1 (default)
|
||
|
};
|
||
|
if (parseFloat(obj.version) >= 1.3) {
|
||
|
obj.crs = crs.code;
|
||
|
obj.i = xy.x;
|
||
|
obj.j = xy.y;
|
||
|
} else {
|
||
|
obj.srs = crs.code;
|
||
|
obj.x = Math.floor(xy.x);
|
||
|
obj.y = Math.floor(xy.y);
|
||
|
}
|
||
|
$.ajax({
|
||
|
url: url + L.Util.getParamString(obj, url, true),
|
||
|
success: function (data, status, xhr) {
|
||
|
var html = "<span style='font-size:12px;'><b>Coordinate : " + loc + "</b></span><br/>";
|
||
|
|
||
|
if (geojson) {
|
||
|
map.removeLayer(geojson);
|
||
|
}
|
||
|
|
||
|
if (data.features) {
|
||
|
var features = data.features;
|
||
|
if (features.length) {
|
||
|
html += "<span style='font-size:12px;padding:5px 0px 10px 0px;'><b>Layers trovati: " + features.length+"</b></span>";
|
||
|
geojson = L.Proj.geoJson(data).addTo(map);
|
||
|
|
||
|
for (var i in features) {
|
||
|
var feature = features[i];
|
||
|
|
||
|
var properties = feature.properties;
|
||
|
|
||
|
var namelayer = [ //MATRICE PER LAYER
|
||
|
["CP.CadastralParcel", "Particelle AdE"],
|
||
|
["<?php echo $_SESSION['COMUNE_PROV']; ?>_regimi_normativi", "BBCCAA Regimi normativi"],
|
||
|
["sif_vincolo_idrogeo", "Vincolo Idrogeologico"],
|
||
|
["sic_zps", "SIC-ZPS-ZSC"],
|
||
|
["riserve_sicilia", "Riserve"],
|
||
|
["particelle_<?php echo $_SESSION['COMUNE_BELF']; ?>", "Particelle catastali"],
|
||
|
["particelle_modificate", "Particelle catastali"],
|
||
|
["zoning_<?php echo $_SESSION['COMUNE_BELF']; ?>", "P.R.G."],
|
||
|
["vincoli_<?php echo $_SESSION['COMUNE_BELF']; ?>", "Vincoli di P.R.G."],
|
||
|
["geologia_<?php echo $_SESSION['COMUNE_BELF']; ?>", "Geologia"]
|
||
|
];
|
||
|
|
||
|
//var arrayLength = ;
|
||
|
for (var i = 0; i < namelayer.length; i++) {
|
||
|
var titolo = namelayer[i];
|
||
|
|
||
|
for (var y = 0; y < titolo.length; y++) {
|
||
|
|
||
|
var layertitle = feature.id;
|
||
|
var title = layertitle.split('.');
|
||
|
|
||
|
if (title[0] == titolo[y-1]) {
|
||
|
|
||
|
//html += '<br/><table><caption>' + titolo[y] + ' - ' + title[1] + '</caption>';
|
||
|
html += '<br/><table><caption>' + titolo[y] + '</caption>';
|
||
|
}
|
||
|
}
|
||
|
} //FINE MATRICE PER ETICHETTE CAMPI
|
||
|
|
||
|
html += '<table width="600px">';
|
||
|
//html += '<thead><tr><th>Campo</th><th>Valore</th></tr></thead><tbody>';
|
||
|
for (var x in properties) {
|
||
|
var etichette = [ //MATRICE PER ETICHETTE CAMPI
|
||
|
["contesto","Contesto"],
|
||
|
["pl","Paesaggio locale"],
|
||
|
["liv_tutela","Livello di tutela"],
|
||
|
["codice","Codice"],
|
||
|
["tipo","Tipo"],
|
||
|
["denom","Denominazione"],
|
||
|
["denominazi","Denominazione"],
|
||
|
["foglio","Foglio"],
|
||
|
["numero","Particella"],
|
||
|
["zon_sigla","Sigla"],
|
||
|
["zon_descr","Zoning"],
|
||
|
["zona","Zona"],
|
||
|
["denomi","Denominazione"],
|
||
|
["tipo_sito","Tipo"],
|
||
|
["sic_zsc","SIC/ZPS/ZSC"],
|
||
|
["tipologia","Tipo"],
|
||
|
["denom","Denominazione"],
|
||
|
["tipo_suolo","Tipo di suolo"],
|
||
|
["civico","Civico"],
|
||
|
["esponente","Esponente"],
|
||
|
["dug","DUG"],
|
||
|
["duf","DUF"],
|
||
|
["tip_gest","Gestione"],
|
||
|
["funz","Funzione"],
|
||
|
["essenza","Essenza"],
|
||
|
["descriz","Descrizione"],
|
||
|
["luogo","Luogo"],
|
||
|
["classe","Classe"],
|
||
|
["sigla","Sigla"],
|
||
|
["litotipo","Litotipo"]
|
||
|
];
|
||
|
|
||
|
//var arrayLength = ;
|
||
|
for (var i = 0; i < etichette.length; i++) {
|
||
|
var label = etichette[i];
|
||
|
|
||
|
for (var j = 0; j < label.length; j++) {
|
||
|
if (x == label[j]) {
|
||
|
html += '<tr><th style="width:35%!important">' + label[j+1] + '</th><td>' + properties[x] + '</td></tr>';
|
||
|
}
|
||
|
}
|
||
|
} //FINE MATRICE PER ETICHETTE CAMPI
|
||
|
}
|
||
|
|
||
|
if (title[0] == "particelle_<?php echo $_SESSION['COMUNE_BELF']; ?>") {
|
||
|
html += '<tr><td colspan="2"><caption style="text-align:center;">'
|
||
|
html += '<a class="catainfo" data-toggle="modal" data-target="#modalcata" data-id="'+title[1]+'" href="#" style="color:#ffffff">Visualizza Vincoli</a>'
|
||
|
html += '<caption></td></tr>';
|
||
|
}
|
||
|
if (title[0] == "particelle_modificate") {
|
||
|
html += '<tr><td colspan="2"><caption style="text-align:center;">'
|
||
|
html += '<a class="catainfo" data-toggle="modal" data-target="#modalcata" data-id="'+title[1]+'" href="#" style="color:#ffffff">Visualizza Vincoli</a>'
|
||
|
html += '<caption></td></tr>';
|
||
|
}
|
||
|
if (title[0] == "zoning_<?php echo $_SESSION['COMUNE_BELF']; ?>") {
|
||
|
html += '<tr><td colspan="2"><caption style="text-align:center;">'
|
||
|
html += '<a class="zoninfo" data-toggle="modal" data-target="#modalzon" data-id="'+title[1]+'" href="#" style="color:#ffffff">Dettaglio zonizzazione</a>'
|
||
|
html += '<caption></td></tr>';
|
||
|
}
|
||
|
|
||
|
html += '</tbody></table>';
|
||
|
6
|
||
|
}
|
||
|
} else {
|
||
|
html += "Nessun layer trovato.";
|
||
|
}
|
||
|
} else {
|
||
|
//html += "Failed to Read the Feature(s).";
|
||
|
//html += "";
|
||
|
}
|
||
|
map.openPopup(html, loc, { maxHeight: 500 });
|
||
|
|
||
|
$('.zoninfo').click(function(){
|
||
|
var infoid = $(this).data('id');
|
||
|
// AJAX request
|
||
|
$.ajax({
|
||
|
url: 'map_info.php?lay=zon',
|
||
|
type: 'post',
|
||
|
data: {infoid: infoid},
|
||
|
success: function(response, xhr){
|
||
|
// Add response in Modal body
|
||
|
$('.modal-body').html(response);
|
||
|
// Display Modal
|
||
|
$('#wmsinfo').modal('show');
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
|
||
|
$('.catainfo').click(function(){
|
||
|
var infoid = $(this).data('id');
|
||
|
// AJAX request
|
||
|
$.ajax({
|
||
|
url: 'map_info.php?lay=cata',
|
||
|
type: 'post',
|
||
|
data: {infoid: infoid},
|
||
|
success: function(response, xhr){
|
||
|
// Add response in Modal body
|
||
|
$('.modal-body').html(response);
|
||
|
// Display Modal
|
||
|
$('#wmsinfo').modal('show');
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
|
||
|
},
|
||
|
error: function (xhr, status, err) {
|
||
|
if (geojson) {
|
||
|
map.removeLayer(geojson);
|
||
|
}
|
||
|
html += "Unable to Complete the Request.: " + err;
|
||
|
map.openPopup(html, loc);
|
||
|
} });
|
||
|
|
||
|
});
|
||
|
|
||
|
// ########### END POPUP
|
||
|
|
||
|
|
||
|
// ##### PRINT SECTION
|
||
|
L.control.browserPrint({
|
||
|
printLayer: L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||
|
id: 'mapbox.light',
|
||
|
minZoom: 9,
|
||
|
maxZoom: 19,
|
||
|
ext: 'png'
|
||
|
}),
|
||
|
closePopupsOnPrint: false,
|
||
|
printModes: [
|
||
|
L.control.browserPrint.mode.landscape("Orizzontale"),
|
||
|
L.control.browserPrint.mode.portrait("Verticale"),
|
||
|
L.control.browserPrint.mode.auto("Auto", "B4"),
|
||
|
L.control.browserPrint.mode.custom("Seleziona l'area", "B4")
|
||
|
]
|
||
|
|
||
|
}).addTo(map);
|
||
|
// ##### PRINT SECTION
|
||
|
|
||
|
// ########### BEGIN FOOTER SECTION ###########
|
||
|
L.control.coordinates({
|
||
|
position:"bottomleft",
|
||
|
decimals:4,
|
||
|
decimalSeperator:",",
|
||
|
labelTemplateLng:"Longitudine: {x}",
|
||
|
labelTemplateLat:"Latitudine: {y}"
|
||
|
}).addTo(map);
|
||
|
L.control.scale({
|
||
|
maxWidth: 200,
|
||
|
metric: true,
|
||
|
imperial: false,
|
||
|
position: 'bottomleft'
|
||
|
}).addTo(map)
|
||
|
|
||
|
var hash = new L.Hash(map);
|
||
|
// ########### END FOOTER SECTION ###########
|
||
|
|
||
|
// ########### BEGIN CONTROL LAYER ###########
|
||
|
var options = {
|
||
|
collapsed: false,
|
||
|
closedSymbol: '<i class="fal fa-plus-square" style="margin-right:5px"></i>',
|
||
|
openedSymbol: '<i class="fal fa-minus-square" style="margin-right:5px"></i>',
|
||
|
namedToggle: false,
|
||
|
spaceSymbol: ' ',
|
||
|
selectorBack: false,
|
||
|
collapseAll: '',
|
||
|
expandAll: '',
|
||
|
};
|
||
|
|
||
|
//// Add Sidebar
|
||
|
var sidebar = L.control.sidebar('sidebar').addTo(map);
|
||
|
|
||
|
//// Use the custom grouped layer control, not "L.control.layers"
|
||
|
var layerControl = L.control.layers.tree(baseTree, overlaysTree, options);
|
||
|
|
||
|
//layerControl.addTo(map);
|
||
|
layerControl.addTo(map).collapseTree().expandSelected().collapseTree(true);
|
||
|
|
||
|
var layerControlTree = layerControl.getContainer();
|
||
|
var a = document.getElementById('home');
|
||
|
function setParent(el, newParent) { newParent.appendChild(el); }
|
||
|
setParent(layerControlTree, a);
|
||
|
|
||
|
|
||
|
// ########### END CONTROL LAYER ###########
|
||
|
var loader = L.control.loader().addTo(map);
|
||
|
setTimeout(function (){loader.hide();},2000);
|
||
|
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style>
|
||
|
.grid-print-container {
|
||
|
grid-template: auto 1fr auto / 1fr;
|
||
|
background-color: orange;
|
||
|
}
|
||
|
.grid-map-print { grid-row: 2; }
|
||
|
|
||
|
.grid-print-container > .title,
|
||
|
.grid-print-container > .sub-content {
|
||
|
color: white;
|
||
|
}
|
||
|
.title {
|
||
|
grid-row: 1;
|
||
|
justify-self: center;
|
||
|
text-align: center;
|
||
|
color: grey;
|
||
|
box-sizing: border-box;
|
||
|
}
|
||
|
.sub-content {
|
||
|
grid-row: 5;
|
||
|
padding-left: 10px;
|
||
|
text-align: center;
|
||
|
color: grey;
|
||
|
box-sizing: border-box;
|
||
|
}
|
||
|
|
||
|
[leaflet-browser-print-pages] { display: none; }
|
||
|
|
||
|
.pages-print-container [leaflet-browser-print-pages] { display: block; }
|
||
|
|
||
|
.leaflet-control-layers-expanded {
|
||
|
padding: 0px 10px 0px 6px;
|
||
|
color: #333;
|
||
|
background: rgba(255, 255, 255, 0);
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
</main>
|
||
|
|
||
|
<!-- FOOTER -->
|
||
|
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<style>
|
||
|
|
||
|
.modal-dialog,
|
||
|
.modal-content {
|
||
|
/* 80% of window height */
|
||
|
height: 85%;
|
||
|
}
|
||
|
|
||
|
.modal-body {
|
||
|
/* 100% = dialog height, 120px = header + footer */
|
||
|
max-height: calc(100% - 120px);
|
||
|
overflow-y: scroll;
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
|
||
|
<script src="assets/js/bootstrap-italia.bundle.js"></script>
|
||
|
|
||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/4.1.0/anchor.min.js"></script>
|
||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.1/clipboard.min.js"></script>
|
||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/particles.js/2.0.0/particles.min.js"></script>
|
||
|
|
||
|
|
||
|
</body>
|
||
|
</html>
|