up dashboard osmose de ville

This commit is contained in:
Tykayn 2025-08-31 18:23:41 +02:00 committed by tykayn
parent 1535cf8ee3
commit 684bf1da66
3 changed files with 108 additions and 27 deletions

View file

@ -102,9 +102,14 @@
</select>
</div>
<div class="col-md-6 text-end">
<a href="{{ osmoseApiUrl }}" target="_blank" class="btn btn-primary">
<i class="fas fa-external-link-alt"></i> Voir sur Osmose
</a>
<div class="btn-group">
<a href="{{ osmoseApiUrl }}" target="_blank" class="btn btn-primary">
<i class="fas fa-external-link-alt"></i> Voir sur Osmose
</a>
<a href="{{ jsonOsmose }}" target="_blank" class="btn btn-success">
<i class="fas fa-download"></i> Télécharger GeoJSON
</a>
</div>
</div>
</form>
</div>
@ -268,11 +273,17 @@
// Initialiser la carte avec MapLibre
const map = new maplibregl.Map({
container: 'map',
style: 'https://demotiles.maplibre.org/style.json', // style URL
style: 'https://api.maptiler.com/maps/streets/style.json?key={{ maptiler_token|default("") }}', // Utiliser MapTiler si disponible
center: [{{ city.lon }}, {{ city.lat }}], // Note: MapLibre uses [longitude, latitude] order
zoom: 13
});
// Gérer les erreurs de chargement de la carte
map.on('error', function(e) {
console.error('Erreur de chargement de la carte:', e.error);
document.getElementById('map').innerHTML = '<div class="alert alert-danger">Erreur de chargement de la carte. Veuillez réessayer plus tard.</div>';
});
// Ajouter les contrôles de navigation
map.addControl(new maplibregl.NavigationControl());
@ -299,6 +310,13 @@
});
{% endfor %}
// Vérifier s'il y a des problèmes à afficher
if (features.length === 0) {
// Ajouter un message si aucun problème n'est trouvé
const mapContainer = document.getElementById('map');
mapContainer.insertAdjacentHTML('afterend', '<div class="alert alert-info mt-3">Aucun problème Osmose trouvé pour cette ville avec le filtre actuel.</div>');
}
// Ajouter la source de données à la carte
map.addSource('issues', {
type: 'geojson',

View file

@ -294,20 +294,25 @@
<div class="row mb-4" id="themes">
<div class="col-12">
<h2 class="section-anchor">Thèmes</h2>
<ul class="nav nav-tabs" id="themeTabs" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="tab-table" data-bs-toggle="tab"
data-bs-target="#tabTableContent" type="button" role="tab"
aria-controls="tabTableContent" aria-selected="true">Tableau
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="tab-cards" data-bs-toggle="tab"
data-bs-target="#tabCardsContent" type="button" role="tab"
aria-controls="tabCardsContent" aria-selected="false">Cartes
</button>
</li>
</ul>
<div class="d-flex justify-content-between align-items-center mb-3">
<ul class="nav nav-tabs" id="themeTabs" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="tab-table" data-bs-toggle="tab"
data-bs-target="#tabTableContent" type="button" role="tab"
aria-controls="tabTableContent" aria-selected="true">Tableau
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="tab-cards" data-bs-toggle="tab"
data-bs-target="#tabCardsContent" type="button" role="tab"
aria-controls="tabCardsContent" aria-selected="false">Cartes
</button>
</li>
</ul>
<a href="{{ path('app_admin_osmose_issues_map', {'inseeCode': stats.zone}) }}" class="btn btn-primary">
<i class="bi bi-exclamation-triangle"></i> Voir les alertes Osmose
</a>
</div>
<div class="tab-content" id="themeTabsContent">
<div class="tab-pane fade show active" id="tabTableContent" role="tabpanel"
aria-labelledby="tab-table">