feat: Show search radius only if a search center is given and correct zoom level if no location is given

This commit is contained in:
moanos [he/him] 2025-01-09 23:27:33 +01:00
parent c46a943c7f
commit 2dc038dfef
2 changed files with 12 additions and 9 deletions

View File

@ -14,22 +14,23 @@
<!-- start map --> <!-- start map -->
<script> <script>
{% if map_center %}
var center = [{{ map_center.longitude | pointdecimal }}, {{ map_center.latitude | pointdecimal }}];
{% else %}
var center = [10.49, 50.68];
{% endif %}
{% if zoom_level %} {% if zoom_level %}
var zoom_level = {{ zoom_level }}; var zoom_level = {{ zoom_level }};
{% else %} {% else %}
var zoom_level = 4; var zoom_level = 4;
{% endif %} {% endif %}
{% if map_center %}
var map_center = [{{ map_center.longitude | pointdecimal }}, {{ map_center.latitude | pointdecimal }}];
{% else %}
var map_center = [10.49, 50.68]; <!-- Point middle of Germany -->
zoom_level = 4; //Overwrite zoom level when no place is found
{% 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: map_center,
zoom: zoom_level zoom: zoom_level
}).addControl(new maplibregl.NavigationControl()); }).addControl(new maplibregl.NavigationControl());
@ -102,14 +103,15 @@
}); });
}); });
{% if search_radius %} {% if search_center %}
var search_center = [{{ search_center.longitude | pointdecimal }}, {{ search_center.latitude | pointdecimal }}];
map.on('load', () => { map.on('load', () => {
const radius = {{ search_radius }}; // kilometer const radius = {{ search_radius }}; // kilometer
const options = { const options = {
steps: 64, steps: 64,
units: 'kilometers' units: 'kilometers'
}; };
const circle = turf.circle(center, radius, options); const circle = turf.circle(search_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', {

View File

@ -204,6 +204,7 @@ def search(request):
"searched": searched, "searched": searched,
"adoption_notices_map": AdoptionNotice.get_active_ANs(), "adoption_notices_map": AdoptionNotice.get_active_ANs(),
"map_center": search.position, "map_center": search.position,
"search_center": search.position,
"map_pins": [search], "map_pins": [search],
"location": search.location, "location": search.location,
"search_radius": search.max_distance, "search_radius": search.max_distance,