45 lines
No EOL
1.3 KiB
HTML
45 lines
No EOL
1.3 KiB
HTML
{% extends "layout.html" %}
|
|
|
|
{% block title %}Event {{ id }} - OpenEventDatabase{% endblock %}
|
|
|
|
{% block css %}
|
|
<style>
|
|
#map { width:100%; height: 360px; border:1px solid #ddd; border-radius:4px; }
|
|
table { width:100%; border-collapse: collapse; margin-top:12px; }
|
|
th, td { padding: 6px 8px; border-bottom: 1px solid #eee; text-align:left; }
|
|
th { background:#f9fafb; }
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block header %}Évènement {{ id }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div id="map"></div>
|
|
<table>
|
|
<thead><tr><th>Clé</th><th>Valeur</th></tr></thead>
|
|
<tbody>
|
|
{% for key, value in properties.items()|sort %}
|
|
<tr>
|
|
<td>{{ key }}</td>
|
|
<td>{{ value }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
const f = JSON.parse('{{ feature_json|safe }}');
|
|
const map = new maplibregl.Map({
|
|
container: 'map',
|
|
style: 'https://tiles.openfreemap.org/styles/liberty',
|
|
center: f.geometry && f.geometry.coordinates ? f.geometry.coordinates : [2.3522,48.8566],
|
|
zoom: 12
|
|
});
|
|
map.addControl(new maplibregl.NavigationControl());
|
|
if (f.geometry && f.geometry.type === 'Point') {
|
|
new maplibregl.Marker().setLngLat(f.geometry.coordinates).addTo(map);
|
|
}
|
|
</script>
|
|
{% endblock %} |