33 lines
1.2 KiB
Plaintext
33 lines
1.2 KiB
Plaintext
{% if page.map %}
|
|
<script
|
|
defer
|
|
src="https://unpkg.com/leaflet@{{ site.leaflet.version }}/dist/leaflet.js"
|
|
integrity="{{ site.leaflet.integrity.js }}"
|
|
crossorigin=""
|
|
></script>
|
|
<script>
|
|
/* Create leaflet map as another node and hide the code block, appending the leaflet node after it */
|
|
document.onreadystatechange = () => {
|
|
if (document.readyState === 'complete') {
|
|
document.querySelectorAll('pre>code.language-geojson').forEach((elem) => {
|
|
const jsonData = elem.textContent;
|
|
const backup = elem.parentElement;
|
|
backup.classList.add('unloaded');
|
|
/* create leaflet node */
|
|
let mapElement = document.createElement('div');
|
|
mapElement.classList.add('map');
|
|
backup.after(mapElement);
|
|
|
|
var map = L.map(mapElement);
|
|
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
maxZoom: 19,
|
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
|
|
}).addTo(map);
|
|
let geoJSON = L.geoJSON(JSON.parse(jsonData)).addTo(map);
|
|
map.fitBounds(geoJSON.getBounds());
|
|
});
|
|
}
|
|
};
|
|
</script>
|
|
{% endif %}
|