ajout analyses osmose dans les pages de détail
This commit is contained in:
Tykayn
tykayn
parent
359d4ba6b8
commit
0aaddb44c5
13 changed files with 1963 additions and 12 deletions
|
|
@ -105,6 +105,20 @@
|
|||
font-size: 0.95em;
|
||||
}
|
||||
|
||||
.osmose-popup-tag {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.osmose-popup-tag-key {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.osmose-popup-buttons {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
|
||||
/* Bouton flottant suggestion desktop */
|
||||
.suggestion-float-btn {
|
||||
|
|
@ -340,6 +354,17 @@
|
|||
const mapToken = '{{ maptiler_token }}';
|
||||
// Liste des tags attendus pour la complétion de ce thème
|
||||
const completionTags = {{ completion_tags[theme]|json_encode|raw }};
|
||||
|
||||
// Mapping des thèmes vers les IDs d'items Osmose
|
||||
const osmoseItemsMapping = {
|
||||
'charging_station': [8410, 8411],
|
||||
'school': [8031],
|
||||
'healthcare': [8211, 7220, 8331],
|
||||
'laboratory': [7240, 8351],
|
||||
'police': [8190, 8191],
|
||||
'defibrillator': [8370]
|
||||
// Ajouter d'autres thèmes selon les besoins
|
||||
};
|
||||
let mapInstance = null;
|
||||
const basemaps = {
|
||||
'streets': 'https://api.maptiler.com/maps/streets/style.json?key=' + mapToken,
|
||||
|
|
@ -361,6 +386,38 @@
|
|||
zoom: 13
|
||||
});
|
||||
mapInstance.addControl(new maplibregl.NavigationControl());
|
||||
|
||||
// Charger les analyses Osmose si le thème est supporté
|
||||
const currentTheme = '{{ theme }}';
|
||||
if (osmoseItemsMapping[currentTheme]) {
|
||||
// Récupérer les coordonnées de la commune pour la bounding box
|
||||
fetch(`https://geo.api.gouv.fr/communes?code={{ stats.zone }}&fields=centre,nom,code,codesPostaux,population,surface,contour`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data && data.length > 0) {
|
||||
const commune = data[0];
|
||||
if (commune.centre && commune.centre.coordinates) {
|
||||
// Calculer la bounding box pour la requête Osmose
|
||||
const lon = commune.centre.coordinates[0];
|
||||
const lat = commune.centre.coordinates[1];
|
||||
const offset = 0.05; // Environ 5km
|
||||
const bbox = [
|
||||
lon - offset,
|
||||
lat - offset,
|
||||
lon + offset,
|
||||
lat + offset
|
||||
];
|
||||
|
||||
// Charger les analyses Osmose
|
||||
loadOsmoseAnalyses(mapInstance, currentTheme, bbox);
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Erreur lors du chargement des coordonnées de la commune:', error);
|
||||
});
|
||||
}
|
||||
|
||||
// Gestion du changement de fond de carte
|
||||
const basemapSelect = document.getElementById('basemapSelect');
|
||||
if (basemapSelect) {
|
||||
|
|
@ -630,11 +687,14 @@
|
|||
// Mettre à jour les statistiques
|
||||
function updateStats() {
|
||||
// Use current metrics from server if available
|
||||
if (typeof currentCount !== 'undefined') {
|
||||
document.getElementById('currentCount').textContent = currentCount;
|
||||
} else if (Array.isArray(countData) && countData.length > 0) {
|
||||
const latestCount = countData[countData.length - 1];
|
||||
document.getElementById('currentCount').textContent = latestCount.value;
|
||||
if (document.getElementById('currentCount')) {
|
||||
|
||||
if (typeof currentCount !== 'undefined') {
|
||||
document.getElementById('currentCount').textContent = currentCount;
|
||||
} else if (Array.isArray(countData) && countData.length > 0) {
|
||||
const latestCount = countData[countData.length - 1];
|
||||
document.getElementById('currentCount').textContent = latestCount.value;
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof currentCompletion !== 'undefined') {
|
||||
|
|
@ -793,5 +853,122 @@
|
|||
{% else %}
|
||||
console.log('[DEBUG][Overpass] Aucune requête Overpass transmise à la page.');
|
||||
{% endif %}
|
||||
|
||||
// Fonction pour charger les analyses Osmose
|
||||
function loadOsmoseAnalyses(map, theme, bbox) {
|
||||
const items = osmoseItemsMapping[theme];
|
||||
if (!items || items.length === 0) return;
|
||||
|
||||
const itemsParam = items.join(',');
|
||||
const bboxParam = bbox.join(',');
|
||||
const osmoseUrl = `https://osmose.openstreetmap.fr/api/0.3/issues?zoom=12&item=${itemsParam}&level=1,2,3&limit=500&bbox=${bboxParam}`;
|
||||
|
||||
fetch(osmoseUrl)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (!data.issues || data.issues.length === 0) {
|
||||
console.log('Aucune analyse Osmose trouvée pour ce thème dans cette zone.');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`[Osmose] ${data.issues.length} analyses trouvées pour le thème ${theme}`);
|
||||
|
||||
// Ajouter les marqueurs pour chaque analyse
|
||||
data.issues.forEach(issue => {
|
||||
if (issue.lat && issue.lon) {
|
||||
|
||||
let lapopup = new maplibregl.Popup({offset: 25})
|
||||
.setHTML(
|
||||
(() => {
|
||||
|
||||
return `<div id="osmose-popup-${issue.id}" onclick="loadOsmoseIssueDetails(${issue.id})">Chargement des détails... ${issue.id}</div>`
|
||||
})());
|
||||
|
||||
lapopup.on('open', () => {
|
||||
// Charger les détails de l'analyse lorsque le popup est ouvert
|
||||
console.log('open popup', issue)
|
||||
// loadOsmoseIssueDetails(issue.id);
|
||||
});
|
||||
|
||||
// Créer un marqueur pour l'analyse
|
||||
const marker = new maplibregl.Marker({
|
||||
color: '#8A2BE2' // Violet
|
||||
})
|
||||
.setLngLat([issue.lon, issue.lat])
|
||||
// Ajouter un popup au marqueur
|
||||
.setPopup(
|
||||
lapopup
|
||||
)
|
||||
.addTo(map);
|
||||
console.log('marker', marker)
|
||||
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Erreur lors du chargement des analyses Osmose:', error);
|
||||
});
|
||||
}
|
||||
|
||||
// Fonction pour charger les détails d'une analyse Osmose
|
||||
function loadOsmoseIssueDetails(issueId) {
|
||||
const detailsUrl = `https://osmose.openstreetmap.fr/api/0.3/issue/${issueId}?langs=auto`;
|
||||
|
||||
console.log('detailsUrl', detailsUrl)
|
||||
fetch(detailsUrl)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (!data || !data.issue) return;
|
||||
|
||||
const issue = data.issue;
|
||||
const popupElement = document.getElementById(`osmose-popup-${issueId}`);
|
||||
if (!popupElement) return;
|
||||
|
||||
// Construire le contenu du popup
|
||||
let popupContent = `
|
||||
<h4>${issue.title || 'Analyse Osmose'}</h4>
|
||||
<p>${issue.subtitle || ''}</p>
|
||||
`;
|
||||
|
||||
// Ajouter les tags proposés s'ils existent
|
||||
if (issue.fixes && issue.fixes.length > 0 && issue.fixes[0].tags) {
|
||||
popupContent += '<div class="osmose-popup-tags">';
|
||||
popupContent += '<h5>Tags proposés:</h5>';
|
||||
|
||||
Object.entries(issue.fixes[0].tags).forEach(([key, value]) => {
|
||||
popupContent += `
|
||||
<div class="osmose-popup-tag">
|
||||
<span class="osmose-popup-tag-key">${key}</span>:
|
||||
<span class="osmose-popup-tag-value">${value}</span>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
|
||||
popupContent += '</div>';
|
||||
}
|
||||
|
||||
// Ajouter les boutons d'action
|
||||
popupContent += `
|
||||
<div class="osmose-popup-buttons">
|
||||
<a href="https://osmose.openstreetmap.fr/fr/error/${issueId}" target="_blank" class="btn btn-sm btn-primary">
|
||||
<i class="bi bi-eye"></i> Voir sur Osmose
|
||||
</a>
|
||||
<a href="http://localhost:8111/load_and_zoom?left=${issue.lon - 0.001}&right=${issue.lon + 0.001}&top=${issue.lat + 0.001}&bottom=${issue.lat - 0.001}" target="_blank" class="btn btn-sm btn-success">
|
||||
<i class="bi bi-tools"></i> Réparer dans JOSM
|
||||
</a>
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Mettre à jour le contenu du popup
|
||||
popupElement.innerHTML = popupContent;
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Erreur lors du chargement des détails de l\'analyse Osmose:', error);
|
||||
const popupElement = document.getElementById(`osmose-popup-${issueId}`);
|
||||
if (popupElement) {
|
||||
popupElement.innerHTML = '<div class="alert alert-danger">Erreur lors du chargement des détails.</div>';
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -32,6 +32,15 @@
|
|||
</div>
|
||||
<div class="card-body">
|
||||
<div class="list-group">
|
||||
<a href="{{ path('app_admin_import_stats_from_csv') }}" class="list-group-item list-group-item-action">
|
||||
<i class="bi bi-file-earmark-spreadsheet"></i> Importer les Stats depuis le CSV des communes
|
||||
</a>
|
||||
<a href="{{ path('app_admin_labourer_tous_les_budgets') }}" class="list-group-item list-group-item-action">
|
||||
<i class="bi bi-cash-coin"></i> Mettre à jour tous les budgets
|
||||
</a>
|
||||
<a href="{{ path('app_admin_podium_contributeurs_osm') }}" class="list-group-item list-group-item-action">
|
||||
<i class="bi bi-trophy"></i> Podium des contributeurs OSM
|
||||
</a>
|
||||
<a href="{{ path('app_public_index') }}" class="list-group-item list-group-item-action">
|
||||
<i class="bi bi-house"></i> Retour à l'accueil
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue