Produits Entr'ouvert » Combo

Dans l'usage que je connais de markercluster il y a un affichage intéressant du nombre de point recouvert par le cluster (cf ici https://github.com/Leaflet/Leaflet.markercluster) ; ce n'est pas possible ici ?

En fait plus généralement, je ne suis pas sûr que les gens comprennent de quoi il est question ici, on a l'impression qu'on a pointé des parking alors qu'en fait pas du tout, c'est juste un point déposé "au barycentre" (et donc, déjà, il ne devrait pas avoir la forme d'une goutte)

Pour qu'on pige mieux, tu pourrais faire une copie d'écran sans / avec ?

Côté code, if (group_markers == 'True') me pose trop de questions (genre est-ce une évaluation bizarre de plus de javascript ?). Plutôt que se baser sur le str(bool) de Python, je préférerais un truc explicite genre {% if group_markers %}data-group-markers="1"{% endif %} et dans le js alors if ($map_widget.data('group_markers')).

Côté rendu, comme dit Thomas, mais aussi, question sur le comportement quand il y a plusieurs séries de marqueurs affichées, la situation idéale selon moi c'est qu'ils ne se trouvent pas mêlés lors du clustering, à chaque type de données son clustering (et la couleur attribuée à la couche peut être utilisée pour le rond/nombre du cluster). (mais si c'est trop galère, tant pis, créer un ticket pour plus tard).

Sur la capture précedente il y a les marqueurs avec les voitures et puis les clusters à cause du niveau de zoom.

C'est en le lisant ici et en scrutant la capture précédente que je les distingue enfin; il y a du travail côté style pour rendre ça plus visible, c'es étrange qu'un marqueur soit plus visible que 10 marqueurs réunis.

Frédéric Péters a écrit :

Sur la capture précedente il y a les marqueurs avec les voitures et puis les clusters à cause du niveau de zoom.

C'est en le lisant ici et en scrutant la capture précédente que je les distingue enfin; il y a du travail côté style pour rendre ça plus visible, c'es étrange qu'un marqueur soit plus visible que 10 marqueurs réunis.

Ah oui, pareil, je les avait complétement raté. Il faut redéfinir iconCreateFunction un peu comme on le faut avec pointToLayer (peut-être un truc un peu plus gros, genre)

en parle dans un autre ticket

Je donnais explicitement la possibilité d'en créer un.

Avec les cercles plus grands (exemple dans la capture jointe).

Mais il n'y a pas que la taille qui compte; clairement ici l'opacité qui doit être à genre 50% rend les clusters trop peu visibles.

D'un point de vue harmonie, les marqueurs sont opaques, que les clusters le soient aussi; ils pourraient être ronds et genre fond gris #333 avec le nombre dans un disque blanc et en gras, genre.

Charge au thème après de rajouter/ecraser des propriétés.

Encore et toujours je préférerais quand même que par défaut le résultat soit correct; le halo de couleur ne correspond pas à ce qui a lieu sur les marqueurs. Je suis aussi curieux de ta taille de police sur un nombre à trois chiffres.

Aussi, à regarder maintenant les fichiers MarkerCluster.css et MarkerCluster.Default.css, je trouve dommage de devoir faire deux requêtes HTTP pour ça, on devrait avoir tout le nécessaire dès notre combo.map.css.

        data-tile-urltemplate="{{ tile_urltemplate}}" data-map-attribution="{{ map_attribution}}"{% if group_markers %}
        data-group-markers="1"{% endif %}

Mettre la condition sur sa propre ligne serait quand même plus lisible.

                                              var icon_size = 60;
                                              var cluster_size = icon_size - 10;
                                              var childCount = cluster.getChildCount();
                                              var icon_html = '<div style="height:'+cluster_size+'px;width:'+cluster_size+'px;border-radius:'+icon_size/2+'px"><span style="line-height:'+cluster_size+'px">'+childCount+'</span></div>';

Disposant du contrôle des CSS, on ne devrait pas mettre des propriété fixes dans l'attribut style. (ça oblige à utiliser !important dans les css et c'est très mal)

La taille de la police se réduit en fonction de la classe appliquée au marqueur (exemples en PJ).

Mais le 4 prend plus de place que le 10, ce n'est pas terrible (je trouve). (oui j'étais trop content avec mon style)

-webkit-transition et les autres lignes avec préfixe de vendeur, ce n'est vraiment plus nécessaire.

Et je dégagerais aussi la partie IE6-8. Et les choses devenant ainsi plus claires, avec très peu de choses répétées, je ne passerais pas par une variable $cluster_markers et mettrais les règles directement.

background: #fff mais background-color: rgb(181, 226, 140); partout utiliser la même notation. font-size:200% manque un espace. (et je ne trouve toujours pas cette variation de la taille de police pertinente, mais j'abandonne).

'<div><span>'+childCount+'</span></div>'; ici aussi des espaces.

new L.DivIcon({ html mais ici, après l'accolade, non.

Pour pouvoir exploiter davantage les données, l'accès à l'attribut geo_json est nécessaire, j'ai donc besoin de le garder même en mode cluster.

Et pour avoir accès aux événements spécifiques (en l'espèce, spiderify), j'ai aussi besoin d'un accès au L.markerClusterGroup que tu crées :

--- a/combo/apps/maps/static/js/combo.map.js
+++ b/combo/apps/maps/static/js/combo.map.js
@@ -27,6 +27,8 @@ $(function() {
                       return L.marker(latlng, {icon: marker});
                   }
               });
+              if (map.geo_json) map.geo_json.remove();
+              map.geo_json = geo_json;
               if ($map_widget.data('group-markers')) {
                   var markers = L.markerClusterGroup({showCoverageOnHover: false,
                                           zoomToBoundsOnClick: true,
@@ -47,9 +49,8 @@ $(function() {
                                               }});
                   markers.addLayer(geo_json);
                   map.addLayer(markers);
+                  map.clustered_markers = markers;
               } else {
-                  if (map.geo_json) map.geo_json.remove();
-                  map.geo_json = geo_json;
                   geo_json.addTo(map);
               }
               if (callback) {

Tu peux me pointer tes sources geojson pour que je réproduise?

Vélov: https://download.data.grandlyon.com/wfs/rdata?SERVICE=WFS&VERSION=2.0.0&outputformat=GEOJSON&maxfeatures=30000&request=GetFeature&typename=jcd_jcdecaux.jcdvelov&SRSNAME=urn:ogc:def:crs:EPSG::4326
Taxis: https://download.data.grandlyon.com/wfs/grandlyon?SERVICE=WFS&VERSION=2.0.0&outputformat=GEOJSON&request=GetFeature&typename=pvo_patrimoine_voirie.pvostationtaxi

    &-small {
        background: #b5e28c;
        div {
            font-size: 200%;
        }
    }
    &-medium {
        background-color: #f1d357;
        div {
            font-size: 200%;

Une fois background une fois background-color je ne comprends même pas comment un patch peut régresser sur des trucs pareils.

Ok, passons ainsi, ack.