tykayn/osm-commerces
1
0
Fork 0
mirror of https://forge.chapril.org/tykayn/osm-commerces synced 2025-06-20 01:44:42 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

handle missing elements in scripts, simplify stats page

Browse source
This commit is contained in:
Tykayn 2025-06-01 18:56:01 +02:00 • committed by tykayn
parent 1e30f360a1
commit 344e71d38f
9 changed files with 247 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

104
templates/admin/stats.html.twig
View file

@ -24,7 +24,7 @@
<i class="bi bi-chat-dots"></i> {{ stats.getAvecNote() }} commerces avec note renseignée.
<br>
</div>
<div id="map"></div>
<div class="card mt-4">
<h1 class="card-title">Tableau des commerces</h1>
<table class="table table-bordered">
@ -41,7 +41,7 @@
{% for commerce in stats.places %}
<tr>
<td style="background-color: {{ commerce.hasAddress() ? 'yellowgreen' : 'transparent' }};">
<a href="{{ path('app_admin_commerce', {'id': commerce.id}) }}">{{ commerce.name }}</a>
<a href="{{ path('app_admin_commerce', {'id': commerce.id}) }}"> {% if commerce.name |length %} {{ commerce.name |slice(0, 20) }}... {% else %} (lieu sans nom) {% endif %}</a>
</td>
<td style="background-color: {{ commerce.hasAddress() ? 'yellowgreen' : 'transparent' }};">{{ commerce.address }}</td>
@ -54,22 +54,88 @@
</table>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const headers = document.querySelectorAll('th');
headers.forEach(header => {
const text = header.textContent;
const match = text.match(/\((\d+)\s*\/\s*(\d+)\)/);
if (match) {
const [_, completed, total] = match;
const ratio = completed / total;
const alpha = ratio.toFixed(2);
header.style.backgroundColor = `rgba(154, 205, 50, ${alpha})`;
}
});
});
{% endblock %}
{% block javascripts %}
{{ parent() }}
<script src='https://api.mapbox.com/mapbox-gl-js/v2.15.0/mapbox-gl.js'></script>
<script>
</script>
<style>
</style>
console.log('go faire une carte ');
const request = `[out:json][timeout:25];
area["postal_code"="{{ zip_code }}"]->.searchArea;
(
nw["amenity"]["cafe|bar|restaurant|library|cinema|fast_food"](area.searchArea);
nw["shop"](area.searchArea);
nw["tourism"="museum|hotel|chalet|apartment"](area.searchArea);
nw["office"](area.searchArea);
);
out center;
>;
out skel qt;
`;
document.addEventListener('DOMContentLoaded', function() {
async function fetchland() {
// Construire la requête Overpass
const encodedRequest = encodeURIComponent(request);
console.log('encodedRequest', encodedRequest);
const overpassUrl = `https://overpass-api.de/api/interpreter?data=${encodedRequest}`;
const response = await fetch(overpassUrl);
const data = await response.json();
console.log('data', data);
mapboxgl.accessToken = '{{ mapbox_token }}';
const map = new mapboxgl.Map({
container: 'map',
style: 'https://api.maptiler.com/maps/basic-v2/style.json?key={{ maptiler_token }}',
zoom: 17
});
// Ajouter les marqueurs pour chaque point
if (data.elements && data.elements.length > 0) {
const firstPoint = data.elements[0];
if (firstPoint.lat && firstPoint.lon) {
// Centrer la carte sur le premier point
map.setCenter([firstPoint.lon, firstPoint.lat]);
// Ajouter un marqueur pour le premier point
new mapboxgl.Marker()
.setLngLat([firstPoint.lon, firstPoint.lat])
.setPopup(new mapboxgl.Popup({ offset: 25 })
.setHTML(`<h3>${firstPoint.tags?.name || 'Sans nom'}</h3>`))
.addTo(map);
}
}
}
function colorizeHeaders() {
const headers = document.querySelectorAll('th');
if(headers.length > 0) {
headers.forEach(header => {
const text = header.textContent;
const match = text.match(/\((\d+)\s*\/\s*(\d+)\)/);
if (match) {
const [_, completed, total] = match;
const ratio = completed / total;
const alpha = ratio.toFixed(2);
header.style.backgroundColor = `rgba(154, 205, 50, ${alpha})`;
}
});
}
}
console.log(request);
colorizeHeaders();
fetchland();
})
</script>
{% endblock %}