filtrer une puissance minimale

This commit is contained in:
Tykayn 2025-04-20 00:32:45 +02:00 committed by tykayn
parent d9488e7151
commit 07c0385972
17 changed files with 230 additions and 162 deletions

View file

@ -30,7 +30,17 @@
<img class="icon-img" src="img/prise-de-courant.png" alt="prise"> Libre Charge Map
</h1>
</header>
<div class="research_display">
<div id='spinning_icon'>
<svg id='star' width='4cm' height='4cm' viewBox='0 0 700 400' xmlns='http://www.w3.org/2000/svg'
version='1.1'>
<polygon fill='red' stroke='red' stroke-width='10' points='350,75 379,161 469,161 397,215
423,301 350,250 277,301 303,215
231,161 321,161' />
</svg>
</div>
</div>
<main>
@ -42,17 +52,7 @@
<div id="zoomMessage">
Zoomez pour voir les stations de recharge
</div>
<div class="research_display">
<div id='spinning_icon'>
<svg id='star' width='4cm' height='4cm' viewBox='0 0 700 400' xmlns='http://www.w3.org/2000/svg'
version='1.1'>
<polygon fill='red' stroke='red' stroke-width='10' points='350,75 379,161 469,161 397,215
423,301 350,250 277,301 303,215
231,161 321,161' />
</svg>
</div>
</div>
<div id='count_features_fond'>
</div>
<div id='map'>
@ -109,66 +109,83 @@
<div id="current_station_infos"></div>
<div id="infos_carte"></div>
<!-- <div id="infos_carte"></div> -->
<div id="filters">
<!-- <h2>
<h2>
⚙️ Filtres:
</h2> -->
</h2>
<div class="filter-group">
<!-- TODO ajouter des filtres selon la puissance et le type de socket -->
<p>
<!-- <input type="checkbox" id="filter_unknown_output" checked>
<label for="filter_unknown_output">
Afficher les stations avec une puissance inconnue
</label>
<br> -->
<!-- <input type="checkbox" id="filter_max_output" checked> -->
<label for="filter_max_output">
Afficher les stations avec une puissance supérieure à:
</label>
<span id="filter_max_output_display">
3 kW
</span>
</p>
</div>
<br>
<!-- TODO filtrer les bornes selon la puissance -->
</div>
<div id="statsChargingStation">
<h2 id="toggle-stats" style="cursor: pointer;">
🚀 Puissances des stations: 🔽
</h2>
<div id="found_charging_stations">
</div>
</div>
<hr>
<h2 class="title">
À propos de ce plan</h2>
<p>
La carte thématique proposant des points de charge pour véhicule électrique, basée sur les données
d'OpenStreetMap. Voir la documentation OSM concernant <a
href="https://wiki.openstreetmap.org/wiki/Key:socket:*">les sockets</a> et les
<a href="https://wiki.openstreetmap.org/wiki/FR:Tag:amenity%3Dcharging_station">
stations de recharge pour véhicules électriques
</a>.
<br>
Les analyses Osmose proposent l'intégration de stations de recharges issues de l'open data sur les IRVE de
Data Gouv. Vous pouvez les désactiver dans les filtres de calques. Quand les stations existantes sont
activées, seules les analyses osmoses avec un minimum de distance sont affichées.
</p>
<p>
<br>
Fait par <a href="https://mastodon.cipherbliss.com/@tykayn">Tykayn</a> - <a
href="https://www.cipherbliss.com">www.cipherbliss.com</a>.
<a href="https://forge.chapril.org/tykayn/">Sources disponibles sur la forge du Chapril.</a>
<div class="icones">
<img class="icon-img" src="img/Type2_Connector_Outline.svg" alt="type2">
<img class="icon-img" src="img/type2_combo.svg" alt="prise">
<img class="icon-img" src="img/Type2_socket.svg" alt="prise">
<img class="icon-img" src="img/socket_typee.svg" alt="prise">
<img class="icon-img" src="img/chademo.svg" alt="prise">
<input type="range" min="1" max="400" value="3" class="slider" id="filter_max_output_slider">
</div>
<br>
icones
câble électrique <a href="https://www.flaticon.com/fr/icones-gratuites/energie" title="energie icônes">Energie
icônes créées par rukanicon - Flaticon</a>
<!-- TODO filtrer les bornes selon la puissance -->
</p>
</div>
<div id="statsChargingStation">
<h2 id="toggle-stats" style="cursor: pointer;">
🚀 Puissances des stations: 🔽
</h2>
<div id="found_charging_stations">
</div>
</div>
<hr>
<h2 class="title">
À propos de ce plan</h2>
<p>
La carte thématique proposant des points de charge pour véhicule électrique, basée sur les données
d'OpenStreetMap. Voir la documentation OSM concernant <a
href="https://wiki.openstreetmap.org/wiki/Key:socket:*">les sockets</a> et les
<a href="https://wiki.openstreetmap.org/wiki/FR:Tag:amenity%3Dcharging_station">
stations de recharge pour véhicules électriques
</a>.
<br>
Les analyses Osmose proposent l'intégration de stations de recharges issues de l'open data sur les IRVE de
Data Gouv. Vous pouvez les désactiver dans les filtres de calques. Quand les stations existantes sont
activées, seules les analyses osmoses avec un minimum de distance sont affichées.
</p>
<p>
<br>
Fait par <a href="https://mastodon.cipherbliss.com/@tykayn">Tykayn</a> - <a
href="https://www.cipherbliss.com">www.cipherbliss.com</a>.
<a href="https://forge.chapril.org/tykayn/">Sources disponibles sur la forge du Chapril.</a>
<div class="icones">
<img class="icon-img" src="img/Type2_Connector_Outline.svg" alt="type2">
<img class="icon-img" src="img/type2_combo.svg" alt="prise">
<img class="icon-img" src="img/Type2_socket.svg" alt="prise">
<img class="icon-img" src="img/socket_typee.svg" alt="prise">
<img class="icon-img" src="img/chademo.svg" alt="prise">
</div>
<br>
icones
câble électrique <a href="https://www.flaticon.com/fr/icones-gratuites/energie" title="energie icônes">Energie
icônes créées par rukanicon - Flaticon</a>
</p>
</div>
@ -187,4 +204,4 @@
</script>
</body>
</html>
</html>