add josm links, turf circles of completion

This commit is contained in:
Tykayn 2025-06-06 11:50:37 +02:00 committed by tykayn
parent c4cc4a4050
commit 573d4eeb29
8 changed files with 368 additions and 75 deletions

View file

@ -1,37 +1,37 @@
#!/bin/bash
# Les 10 codes postaux des villes les plus peuplées de France
codes_postaux=(
"75001" # Paris 1er
"13001" # Marseille 1er
"69001" # Lyon 1er
"31000" # Toulouse
"06000" # Nice
"44000" # Nantes
"67000" # Strasbourg
"33000" # Bordeaux
"59000" # Lille
"35000" # Rennes
"75013" # Paris 13e
"75014" # Paris 14e
"75015" # Paris 15e
"75016" # Paris 16e
"75017" # Paris 17e
"75018" # Paris 18e
"75019" # Paris 19e
"76000" # Rouen
"76200" # Dieppe
"77000" # Melun
"78000" # Versailles
"79000" # Orléans
"80000" # Amiens
"81000" # Albi
"42000" # Saint-Étienne
"37000" # Tours
codes_insee=(
"75101" # Paris 1er
"13201" # Marseille 1er
"69381" # Lyon 1er
"31555" # Toulouse
"06088" # Nice
"44109" # Nantes
"67482" # Strasbourg
"33063" # Bordeaux
"59350" # Lille
"35238" # Rennes
"75113" # Paris 13e
"75114" # Paris 14e
"75115" # Paris 15e
"75116" # Paris 16e
"75117" # Paris 17e
"75118" # Paris 18e
"75119" # Paris 19e
"76540" # Rouen
"76217" # Dieppe
"77288" # Melun
"78646" # Versailles
"45234" # Orléans
"80021" # Amiens
"81004" # Albi
"42218" # Saint-Étienne
"37261" # Tours
)
# Pour chaque code postal
for code in "${codes_postaux[@]}"; do
for code in "${codes_insee[@]}"; do
echo "Traitement du code postal: $code"
# Faire la requête curl

92
public/js/turf/turf.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View file

@ -194,20 +194,20 @@ final class AdminController extends AbstractController
// Mettre à jour les statistiques finales
$stats->computeCompletionPercent();
$this->entityManager->persist($stats);
$this->entityManager->flush();
$message = 'Labourage terminé avec succès. ' . $processedCount . ' nouveaux lieux traités.';
if ($updateExisting) {
$message .= ' ' . $updatedCount . ' lieux existants mis à jour.';
$message .= ' ' . $updatedCount . ' lieux existants mis à jour pour la zone '.$stats->getName().' ('.$stats->getZone().').';
}
$this->addFlash('success', $message);
} catch (\Exception $e) {
$this->addFlash('error', 'Erreur lors du labourage : ' . $e->getMessage());
}
return $this->redirectToRoute('app_public_dashboard');
return $this->redirectToRoute('app_admin_stats', ['zip_code' => $zip_code]);
}
#[Route('/admin/delete/{id}', name: 'app_admin_delete')]

View file

@ -6,6 +6,13 @@
{% block stylesheets %}
{{ parent() }}
<link href='{{ asset('js/maplibre/maplibre-gl.css') }}' rel='stylesheet' />
<style>
.completion-circle {
fill-opacity: 0.6;
stroke: #fff;
stroke-width: 3;
}
</style>
{% endblock %}
{% block body %}
@ -18,6 +25,9 @@
</div>
<div class="col-md-6 col-12">
<a href="{{ path('app_admin_labourer', {'zip_code': stats.zone}) }}" class="btn btn-primary" id="labourer">Labourer les mises à jour</a>
<button id="openInJOSM" class="btn btn-secondary ms-2">
<i class="bi bi-map"></i> Ouvrir dans JOSM
</button>
</div>
</div>
<div class="row">
@ -85,9 +95,67 @@
</div>
<script src='{{ asset('js/maplibre/maplibre-gl.js') }}'></script>
<script src='{{ asset('js/turf/turf.min.js') }}'></script>
<script>
const request = `{{query_places|raw}}`;
const zip_code = `{{stats.zone}}`;
let mapElements = [];
function getCompletionColor(completion) {
if (completion === undefined || completion === null) {
return '#808080'; // Gris pour pas d'information
}
// Convertir le pourcentage en couleur verte (0% = blanc, 100% = vert foncé)
const intensity = Math.floor((completion / 100) * 255);
return `rgb(0, ${intensity}, 0)`;
}
function calculateCompletion(element) {
let completed = 0;
let total = 0;
// Critères à vérifier
const criteria = [
'name',
'addr:street',
'addr:housenumber',
'addr:postcode',
'addr:city',
'opening_hours',
'website',
'wheelchair',
'phone'
];
criteria.forEach(criterion => {
if (element.tags && element.tags[criterion]) {
completed++;
}
total++;
});
return total > 0 ? (completed / total) * 100 : 0;
}
function createPopupContent(element) {
console.log("createPopupContent",element);
let tagstable = '<table class="table table-bordered"><tr><th>Clé</th><th>Valeur</th></tr>';
if (element.tags) {
for (const tag in element.tags) {
tagstable += `<tr><td>${tag}</td><td>${element.tags[tag]}</td></tr>`;
}
}
tagstable += '</table>';
return `
<a href="/admin/placeType/${element.type}/${element.id}">
<h3>${element.tags?.name || 'Sans nom'}</h3>
</a>
<br>
<a href="https://openstreetmap.org/${element.type}/${element.id}" target="_blank">OSM</a>
${tagstable}
`;
}
async function fetchland() {
// Requête pour obtenir le contour administratif
@ -155,45 +223,111 @@ out skel qt;`;
}
console.log('map chargé',data.elements);
mapElements = data.elements;
document.getElementById('maploader').classList.add('d-none');
// Créer une source pour les cercles
map.addSource('completion-circles', {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': []
}
});
// Ajouter une couche pour les cercles
map.addLayer({
'id': 'completion-circles',
'type': 'fill',
'source': 'completion-circles',
'paint': {
'fill-color': ['get', 'color'],
'fill-opacity': 0.6,
'fill-outline-color': '#fff'
}
});
// Ajouter une couche pour la bordure
map.addLayer({
'id': 'completion-circles-outline',
'type': 'line',
'source': 'completion-circles',
'paint': {
'line-color': '#0f0',
'line-width': 3
}
});
const features = [];
data.elements.forEach(element => {
// Cherche les coordonnées à la racine ou dans center
const lat = element.lat || (element.center && element.center.lat);
const lon = element.lon || (element.center && element.center.lon);
if (lat && lon && element.tags && element.tags['name']) {
const el = document.createElement('div');
el.className = 'marker';
let tagstable = '<table class="table table-bordered"><tr><th>Clé</th><th>Valeur</th></tr>';
if (element.tags) {
for (const tag in element.tags) {
tagstable += `<tr><td>${tag}</td><td>${element.tags[tag]}</td></tr>`;
}
}
tagstable += '</table>';
// Créer un élément div pour le texte du nom
const nameDiv = document.createElement('div');
nameDiv.className = 'marker-name';
nameDiv.textContent = element.tags?.name || '(Sans nom)';
el.appendChild(nameDiv);
new maplibregl.Marker(el)
.setLngLat([lon, lat])
.setPopup(new maplibregl.Popup({
offset: 25,
anchor: 'bottom'
})
.setHTML(
`<a href="/admin/placeType/${element.type}/${element.id}" ><h3>${element.tags?.name || 'Sans nom'}</h3></a> <br><a href="https://openstreetmap.org/${element.type}/${element.id}" target="_blank">OSM</a> ${tagstable}`
)
)
.addTo(map);
if (lat && lon) {
const completion = calculateCompletion(element);
const color = getCompletionColor(completion);
// Créer un cercle de 20 mètres de rayon (plus petit)
const circle = turf.circle([lon, lat], 0.04, { steps: 64, units: 'kilometers' });
circle.properties = {
color: color,
completion: completion,
name: element.tags?.name || 'Sans nom',
popupContent: createPopupContent(element),
center: [lon, lat] // Stocker le centre comme un tableau [lon, lat]
};
features.push(circle);
}
});
// Mettre à jour la source des cercles
map.getSource('completion-circles').setData({
'type': 'FeatureCollection',
'features': features
});
// Fonction pour recalculer les cercles en fonction du zoom
function updateCircles() {
const zoom = map.getZoom();
const newFeatures = [];
features.forEach(feature => {
// Ajuster la taille du cercle en fonction du zoom
// Plus le zoom est élevé, plus le cercle est petit
const radius = 0.02 / Math.pow(1.5, zoom - 12); // 12 est le niveau de zoom de référence
const newCircle = turf.circle(feature.properties.center, radius, { steps: 64, units: 'kilometers' });
newCircle.properties = feature.properties;
newFeatures.push(newCircle);
});
map.getSource('completion-circles').setData({
'type': 'FeatureCollection',
'features': newFeatures
});
}
// Mettre à jour les cercles lors du zoom
map.on('zoom', updateCircles);
// Ajouter les popups sur les cercles
map.on('click', 'completion-circles', (e) => {
const properties = e.features[0].properties;
new maplibregl.Popup()
.setLngLat(e.lngLat)
.setHTML(properties.popupContent)
.addTo(map);
});
// Changer le curseur au survol des cercles
map.on('mouseenter', 'completion-circles', () => {
map.getCanvas().style.cursor = 'pointer';
});
map.on('mouseleave', 'completion-circles', () => {
map.getCanvas().style.cursor = '';
});
});
// Calculer les limites (bounds) à partir des marqueurs
@ -212,6 +346,47 @@ out skel qt;`;
}
}
function openInJOSM() {
if (mapElements.length === 0) {
alert('Aucun élément à ouvrir dans JOSM');
return;
}
const nodeIds = [];
const wayIds = [];
const relationIds = [];
mapElements.forEach(element => {
switch(element.type) {
case 'node':
nodeIds.push(element.id);
break;
case 'way':
wayIds.push(element.id);
break;
case 'relation':
relationIds.push(element.id);
break;
}
});
let josmUrl = 'http://localhost:8111/load_and_zoom?';
const params = [];
if (nodeIds.length > 0) {
params.push(`node${nodeIds.join(',')}`);
}
if (wayIds.length > 0) {
params.push(`way${wayIds.join(',')}`);
}
if (relationIds.length > 0) {
params.push(`relation${relationIds.join(',')}`);
}
josmUrl += params.join('&');
window.open(josmUrl, '_blank');
}
document.addEventListener('DOMContentLoaded', function() {
console.log('DOMContentLoaded');
const headers = document.querySelectorAll('th');
@ -226,6 +401,8 @@ out skel qt;`;
}
});
document.getElementById('openInJOSM').addEventListener('click', openInJOSM);
fetchland();
sortTable();

View file

@ -10,6 +10,9 @@
{% endif %}
</a>
</td>
<td class="text-right" style="background : rgba(0,255,0,{{ commerce.getCompletionPercentage() / 100 }})">
{{ commerce.getCompletionPercentage() }}
</td>
<td class="{{ commerce.mainTag ? 'filled' : '' }}">
{% if commerce.mainTag == 'amenity=restaurant' or commerce.mainTag == 'amenity=bar' or commerce.mainTag == 'amenity=cafe' %}

View file

@ -2,6 +2,10 @@
<tr>
<th>Nom ({{ stats.places|length }})</th>
<th>
<i class="bi bi-circle-fill"></i>
Completion %
</th>
<th>
<i class="bi bi-tags"></i>
Type
</th>

View file

@ -24,7 +24,8 @@
<div class="card shadow-sm">
<div class="card-body">
<h1 class="card-title h2 mb-4">{{ 'display.welcome'|trans }} {{ commerce_overpass.tags_converted.name }}</h1>
<div id="map" style="height: 400px; width: 100%;" class="rounded mb-4"></div>
<div id="map" style="height: 400px; width: 100%;" class="rounded mb-4"></div>
{% include 'public/edit/address.html.twig' %}
{% if commerce_overpass is not empty %}
<form action="{{ path('app_public_submit', {'osm_object_id': commerce_overpass['@attributes'].id, 'version': commerce_overpass['@attributes'].version, 'changesetID': commerce_overpass['@attributes'].changeset }) }}" method="post" class="needs-validation">
@ -39,6 +40,7 @@
</div>
</div>
{% if commerce_overpass.tags_converted.image is defined %}
<div id="images" class="d-none">
@ -56,12 +58,7 @@
{% include 'public/edit/restaurant.html.twig' %}
{% endif %}
{% if hide_filled_inputs and
(commerce_overpass.tags_converted['addr:street']) is defined and commerce_overpass.tags_converted['addr:street'] is empty
and (commerce_overpass.tags_converted['addr:housenumber']) is defined and commerce_overpass.tags_converted['addr:housenumber'] is empty
%}
{% include 'public/edit/address.html.twig' %}
{% endif %}
{% if hide_filled_inputs and (commerce_overpass.tags_converted.opening_hours) is defined and commerce_overpass.tags_converted.opening_hours is empty %}
<span class="deja-rempli d-none">
@ -139,11 +136,19 @@
<strong>{{ 'display.days_ago'|trans({'%days%': date(commerce_overpass['@attributes'].timestamp).diff(date()).days}) }}</strong>
{{ 'display.by'|trans }}
<a href="https://www.openstreetmap.org/user/{{ commerce_overpass['@attributes'].user }}" target="_blank">{{ commerce_overpass['@attributes'].user }}</a>
</div>
</div>
<div class="lien-OpenStreetMap">
<a href="https://www.openstreetmap.org/node/{{ commerce_overpass['@attributes'].id }}" target="_blank" class="btn btn-outline-secondary">
<a href="https://www.openstreetmap.org/{{commerce.osmKind}}/{{ commerce_overpass['@attributes'].id }}" target="_blank" class="btn btn-outline-secondary">
{{ 'display.view_on_osm'|trans }}
</a>
<button onclick="openInJOSM('{{commerce.osmKind}}', '{{ commerce_overpass['@attributes'].id }}')" class="btn btn-outline-secondary ms-2">
<i class="bi bi-pencil"></i> Éditer dans JOSM
</button>
<button onclick="openInPanoramax()" class="btn btn-outline-secondary ms-2">
<i class="bi bi-camera"></i> Voir dans Panoramax
</button>
</div>
<a href="{{ path('app_admin_stats', {'zip_code': zone ?? '-1'}) }}" class="btn btn-outline-secondary">
<i class="bi bi-bar-chart"></i>
@ -176,7 +181,17 @@
{{ parent() }}
<script src={{asset('js/mapbox/mapbox-gl.js')}}></script>
<script>
function openInJOSM(type, id) {
const josmUrl = `http://localhost:8111/load_object?objects=${type}${id}`;
window.open(josmUrl, '_blank');
}
function openInPanoramax() {
const center = map.getCenter();
const zoom = map.getZoom();
const panoramaxUrl = `https://api.panoramax.xyz/?focus=map&map=${zoom}/${center.lat}/${center.lng}`;
window.open(panoramaxUrl, '_blank');
}
{% if commerce is not empty and mapbox_token is not empty and maptiler_token is not empty and commerce_overpass['@attributes'].lon is defined and commerce_overpass['@attributes'].lat is defined %}
mapboxgl.accessToken = '{{ mapbox_token }}';

View file

@ -1,12 +1,14 @@
<div id="addresses">
<h2>{{ 'display.address'|trans }}</h2>
{# {{ dump(commerce_overpass)}} #}
<div class="row mb-3">
<div class="col-md-5">
<label for="commerce_tag_value__addr:housenumber">{{'display.keys.contact:addr:housenumber'|trans}}</label>
<input type="text" class="form-control" name="commerce_tag_value__contact:addr:housenumber" value="{% if commerce_overpass.tags_converted['contact:addr:housenumber'] is defined %}{{ commerce_overpass.tags_converted['contact:addr:housenumber'] }}{% endif %}">
<label for="commerce_tag_value__addr:housenumber">{{'display.keys.contact:housenumber'|trans}}</label>
<input type="text" class="form-control" name="commerce_tag_value__contact:housenumber" value="{% if commerce_overpass.tags_converted['contact:housenumber'] is defined %}{{ commerce_overpass.tags_converted['contact:housenumber'] }}{% endif %}">
<label for="commerce_tag_value__contact:addr:street">{{'display.keys.contact:addr:street'|trans}}</label>
<input type="text" class="form-control" name="commerce_tag_value__contact:addr:street" value="{% if commerce_overpass.tags_converted['contact:addr:street'] is defined %}{{ commerce_overpass.tags_converted['contact:addr:street'] }}{% endif %}">
<label for="commerce_tag_value__contact:street">{{'display.keys.contact:street'|trans}}</label>
<input type="text" class="form-control" name="commerce_tag_value__contact:street" value="{% if commerce_overpass.tags_converted['contact:street'] is defined %}{{ commerce_overpass.tags_converted['contact:street'] }}{% endif %}">
</div>
</div>
</div>