function Map(geoLocations){
function refreshMap(){
document.getElementById('mapJumbotron').innerHTML = "
";
}
refreshMap();
var map = L.map('map');
map.createPane('labels');
// This pane is above markers but below popups
map.getPane('labels').style.zIndex = 650;
// Layers in this pane are non-interactive and do not obscure mouse/touch events
map.getPane('labels').style.pointerEvents = 'none';
var cartodbAttribution = '© OpenStreetMap contributors, © CARTO';
var positron = L.tileLayer('https://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
attribution: cartodbAttribution
}).addTo(map);
var positronLabels = L.tileLayer('http://{s}.basemaps.cartocdn.com/light_only_labels/{z}/{x}/{y}.png', {
attribution: cartodbAttribution,
pane: 'labels'
}).addTo(map);
function getColor(data) {
const d = data.length
return d == 0 ? '#38b500' : d < 3 ? '#f6d743': d < 10 ? '#fb8500':'#e63946'
}
function style(feature) {
const color = Object.keys(feature.properties).includes('datasets') ? (
feature.properties.datasets
):0
return {
fillColor: getColor(color),
weight: 1,
opacity: 1,
color: 'white',
dashArray: '',
fillOpacity: 0.3
};
}
L.geoJson(geoLocations, { style: style }).addTo(map);
geojson = L.geoJson(geoLocations).addTo(map);
map.fitBounds(L.geoJson(geoLocations).getBounds())
// map.setVgeoLocationsiew({ lat: 47.040182144806664, lng: 9.667968750000002 }, 2);
function highlightFeature(e) {
var layer = e.target;
layer.setStyle({
weight: 1,
color: '#959696',
dashArray: '',
opacity: 1,
fillOpacity: 1
});
if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) {
layer.bringToFront();
}
}
function resetHighlight(e) {
geojson.resetStyle(e.target);
}
var geojson;
// ... our listeners
geojson = L.geoJson(geoLocations);
function zoomToFeature(e) {
map.fitBounds(e.target.getBounds());
}
function showDatasets(layerProps){
if(Object.keys(layerProps).includes('datasets') && layerProps.datasets.length !== 0){
// datasetsLayer.addLayer(layer)
// console.log(layerProps)
let datasets = ""
layerProps.datasets.forEach((el) => {
datasets += `- ${el.name}
`
});
datasets += "
"
let name = Object.keys(layerProps).includes('nameunit') ? layerProps.nameunit:layerProps.NOM_COMAR
let modal = `
`
document.getElementById("modal-wrapper").innerHTML = modal;
$("#modal").modal()
}
}
function onEachFeature(feature, layer){
layer.on({
mouseover: highlightFeature,
mouseout: resetHighlight,
click: (e) =>{showDatasets(layer.feature.properties)}
});
let datasetLength= Object.keys(layer.feature.properties).includes('datasets') ?layer.feature.properties.datasets.length.toString():'0';
const myIcon = L.divIcon({
className: 'datasetIndicatorDiv',
html: `${datasetLength}`,
iconSize: [25, 25],
//iconAnchor: [18, 30]
iconAnchor: [10, 33]
});
const bounds = layer.getBounds();
const latLng = bounds.getCenter();
if(datasetLength > 0){
L.marker(latLng,{
icon:myIcon,
riseOnHover:true
}).addTo(map)
}
layer.bindTooltip(`Datasets: ${datasetLength}`,{opacity:1}).bringToFront()
// layer.bindPopup(function (layer){
// console.log(layer.feature.properties.adm0_a3);
// return '' + layer.feature.properties.nameunit;
// });
}
geojson = L.geoJson(geoLocations, {
style: style,
onEachFeature: onEachFeature
}).addTo(map);
// AQUĆ TERMINA LA PARTE DEL MAPA
}
function init() {
// Parse JSON string into object
getComMadrid().then((data) => {
Map(data);
})
.catch((err) => {
console.log(err)
});
}
function changeLayer(layerName){
// console.log("Cambiamos a: " + layerName)
if(layerName == 'Comarcas'){
getComarcas().then((data) =>{
Map(data);
}).catch((err) => {
// console.log(layerName)
// console.log(err)
})
}else if( layerName == 'Espacios Naturales'){
getParques().then((data) =>{
Map(data);
}).catch((err) => {
// console.log(layerName)
// console.log(err)
})
}else if(layerName== 'Distritos'){
getMadrid().then((data) =>{
Map(data);
}).catch((err) => {
// console.log(layerName)
// console.log(err)
})
}else{
getComMadrid().then((data) => {
Map(data)
}).catch((err) => {console.log(err)})
}
$("#filtro").html(layerName + "")
}
function mostrar_capa(name){
if (name=='sostenibilidad'){
if (document.getElementById('sostenibilidad').style.display=='none'){
document.getElementById('sostenibilidad').style.display='block';
document.getElementById('paisaje').style.display='none';
document.getElementById('manejo').style.display='none';
document.getElementById('recursos').style.display='none';
document.getElementById('distribucion').style.display='none';
document.getElementById('salud').style.display='none';
} else {
document.getElementById('sostenibilidad').style.display='none';
}
} else if (name=='paisaje'){
if (document.getElementById('paisaje').style.display=='none'){
document.getElementById('sostenibilidad').style.display='none';
document.getElementById('paisaje').style.display='block';
document.getElementById('manejo').style.display='none';
document.getElementById('recursos').style.display='none';
document.getElementById('distribucion').style.display='none';
document.getElementById('salud').style.display='none';
} else {
document.getElementById('paisaje').style.display='none';
}
} else if (name=='manejo'){
if (document.getElementById('manejo').style.display=='none'){
document.getElementById('sostenibilidad').style.display='none';
document.getElementById('paisaje').style.display='none';
document.getElementById('manejo').style.display='block';
document.getElementById('recursos').style.display='none';
document.getElementById('distribucion').style.display='none';
document.getElementById('salud').style.display='none';
} else {
document.getElementById('manejo').style.display='none';
}
} else if (name=='recursos'){
if (document.getElementById('recursos').style.display=='none'){
document.getElementById('sostenibilidad').style.display='none';
document.getElementById('paisaje').style.display='none';
document.getElementById('manejo').style.display='none';
document.getElementById('recursos').style.display='block';
document.getElementById('distribucion').style.display='none';
document.getElementById('salud').style.display='none';
} else {
document.getElementById('recursos').style.display='none';
}
} else if (name=='distribucion'){
if (document.getElementById('distribucion').style.display=='none'){
document.getElementById('sostenibilidad').style.display='none';
document.getElementById('paisaje').style.display='none';
document.getElementById('manejo').style.display='none';
document.getElementById('recursos').style.display='none';
document.getElementById('distribucion').style.display='block';
document.getElementById('salud').style.display='none';
} else {
document.getElementById('distribucion').style.display='none';
}
} else if (name=='salud'){
if (document.getElementById('salud').style.display=='none'){
document.getElementById('sostenibilidad').style.display='none';
document.getElementById('paisaje').style.display='none';
document.getElementById('manejo').style.display='none';
document.getElementById('recursos').style.display='none';
document.getElementById('distribucion').style.display='none';
document.getElementById('salud').style.display='block';
} else {
document.getElementById('salud').style.display='none';
}
}
}
init();
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})