fix: deal with undefined
This commit is contained in:
parent
6e2a2a1d5e
commit
8e7cdafee0
@ -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>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user