fix: deal with undefined

This commit is contained in:
moanos [he/him] 2025-01-02 11:14:34 +01:00
parent 6e2a2a1d5e
commit 8e7cdafee0

View File

@ -20,11 +20,17 @@
var center = [10.49, 50.68]; var center = [10.49, 50.68];
{% endif %} {% endif %}
{% if zoom_level %}
var zoom_level = {{ zoom_level }};
{% else %}
var zoom_level = 4;
{% endif %}
let map = new maplibregl.Map({ let map = new maplibregl.Map({
container: 'map', container: 'map',
style: '{% static "fellchensammlung/map/styles/colorful.json" %}', style: '{% static "fellchensammlung/map/styles/colorful.json" %}',
center: center, center: center,
zoom: {{ zoom_level }} zoom: zoom_level
}).addControl(new maplibregl.NavigationControl()); }).addControl(new maplibregl.NavigationControl());
{% for adoption_notice in adoption_notices_map %} {% for adoption_notice in adoption_notices_map %}
@ -46,41 +52,43 @@
{% endif %} {% endif %}
{% endfor %} {% endfor %}
map.on('load', () => { {% if search_radius %}
const radius = {{ search_radius }}; // kilometer map.on('load', () => {
const options = { const radius = {{ search_radius }}; // kilometer
steps: 64, const options = {
units: 'kilometers' steps: 64,
}; units: 'kilometers'
const circle = turf.circle(center, radius, options); };
const circle = turf.circle(center, radius, options);
// Add the circle as a GeoJSON source // Add the circle as a GeoJSON source
map.addSource('location-radius', { map.addSource('location-radius', {
type: 'geojson', type: 'geojson',
data: circle data: circle
}); });
// Add a fill layer with some transparency // Add a fill layer with some transparency
map.addLayer({ map.addLayer({
id: 'location-radius', id: 'location-radius',
type: 'fill', type: 'fill',
source: 'location-radius', source: 'location-radius',
paint: { paint: {
'fill-color': '#8CCFFF', 'fill-color': '#8CCFFF',
'fill-opacity': 0.5 'fill-opacity': 0.5
} }
}); });
// Add a line layer to draw the circle outline // Add a line layer to draw the circle outline
map.addLayer({ map.addLayer({
id: 'location-radius-outline', id: 'location-radius-outline',
type: 'line', type: 'line',
source: 'location-radius', source: 'location-radius',
paint: { paint: {
'line-color': '#0094ff', 'line-color': '#0094ff',
'line-width': 3 'line-width': 3
} }
});
}); });
}); {% endif %}
</script> </script>