hacklab/takethestreet
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Mapa con OpenStreetMap que se mueve y se amplía, después de Síguelas; versión en el CSS para que los móviles no usen el viejo

Browse source
This commit is contained in:
hacklab 2026-10-14 14:42:29 +02:00
parent db898b9a42
commit 0d163dfe36
21 changed files with 1664 additions and 112 deletions
Download patch file Download diff file Expand all files Collapse all files

37
sites/tomalacalle/js/mapa.js Normal file
View file

@ -0,0 +1,37 @@
(function () {
var caja = document.getElementById("mapa-osm"), d = document.getElementById("lugares");
if (!caja || !d || !window.L) return;
d = JSON.parse(d.textContent);
caja.innerHTML = "";
caja.classList.add("vivo");
var mapa = L.map(caja, { scrollWheelZoom: false, worldCopyJump: true });
L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
maxZoom: 18,
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(mapa);
function icono(t) {
if (t === "o" || t === "a") {
var s = t === "o" ? 34 : 22;
return L.divIcon({ className: "pin pin-" + t, html: '<img src="' + d.img + '" alt="">', iconSize: [s, s], iconAnchor: [s / 2, s / 2], popupAnchor: [0, -s / 2] });
}
return L.divIcon({ className: "pin pin-" + t, html: "<span></span>", iconSize: [18, 18], iconAnchor: [9, 9], popupAnchor: [0, -9] });
}
function esc(s) { var e = document.createElement("span"); e.textContent = s; return e.innerHTML; }
d.p.forEach(function (p) {
var h = "<b>" + esc(p.n) + "</b><br>" + esc(d.ley[p.t]);
if (p.u) h += '<br><a href="' + encodeURI(p.u) + '" target="_blank" rel="noopener">' + esc(p.ul) + "</a>";
h += '<br><a href="' + p.c + '">' + esc(d.ver) + "</a>";
L.marker([p.la, p.lo], { icon: icono(p.t), title: p.n, zIndexOffset: p.t === "o" ? 1000 : 0 }).bindPopup(h).addTo(mapa);
});
mapa.fitBounds(d.s[0][1]);
var nav = document.createElement("div");
nav.className = "saltos";
d.s.forEach(function (s) {
var b = document.createElement("button");
b.type = "button";
b.textContent = s[0];
b.onclick = function () { mapa.flyToBounds(s[1], { duration: .8 }); };
nav.appendChild(b);
});
caja.parentNode.insertBefore(nav, caja);
})();