Piwigo.org

Katryne · 2025-03-29 15:06:52

Bonjour
Sur les cartes Open Street Map, à grande échelle, les photos sont regroupées en clusters de couleurs différentes selon l'effectif : vert jusqu'à 10, jaune jusqu'à 100 (je crois), orange au-delà.
Je trouve que les ronds verts se confondent parfois avec le vert symbolisant les forêts du fond de carte et je voudrais changer la couleur des ronds du 1er niveau.

J'ai bien trouvé dans le dossier /leaflet du plugin un fichier de css qui devrait gérer cette histoire (MarkerCluster.Default.css), mais je ne suis pas très sure de ce que je dois faire..
Par exemple pour les ronds verts (que je voudrais en bleu), le fichier d'origine donne :

Code:

.marker-cluster-small {
  background-color: rgba(181, 226, 140, 0.6);
  }
.marker-cluster-small div {
  background-color: rgba(110, 204, 57, 0.6);
  }

puis

Code:

/* IE 6-8 fallback colors */
.leaflet-oldie .marker-cluster-small {
  background-color: rgb(181, 226, 140);
  }
.leaflet-oldie .marker-cluster-small div {
  background-color: rgb(110, 204, 57);
  }

Ma question est : quelle est la différence entre la 1ère classe et celle qui suit avec un div ?
Et aussi : est-ce que je dois forker le fichier ou est-ce que je peux passer Local Files Editor, ou existe-t-il une autre technique ?

Merci

lexi · 2025-03-29 17:00:03

Je n'arrivais pas trop compris sur le moment, mais maintenant je vois bien, tu parles des points de localisation d'une photo qui sont montrée sur une carte OpenStreetMap.

Pour ta question, je pense que tu voulais dire quelle est la différence entre :
la fonction rgb
et
la fonction rgba

Toutes les 2 permettent de définir une couleur mais celle avec le "a" semblerait gérer l'alpha et donc la transparence d'après que j'ai pu lire : https://www.w3schools.com/css/css_colors_rgb.asp

Je dirais que dans tous les cas, tu peux toujours tester les 2 fichiers, après il faudrait mieux utiliser Local Files Editor pour ne pas se faire écraser son paramétrage personnalisé à la prochaine mise à jour.

Katryne · 2025-03-29 17:10:16

Merci Lexi
Non ma question n'est pas au sujet de rgb et rgba, ça je sais pour la transparence.
Je voulais savoir quelle est la différence entre :
.marker-cluster-small et .marker-cluster-small div, à quoi ça correspond pour attribuer les couleurs.

Et si je pose la question sur la modif dans LFE, c'est qu'on y modifie le css d'un template, et là, il s'agit du css d'un plugin, il me semble.

Katryne · 2025-10-26 23:06:06

Bonsoir !
Mon souci est que les clusters de photos de petit niveau (10 au plus) sont du même vert que beaucoup de coloriage de la carte OSM et qu'on ne les distingue pas du fond de carte.
Je suis revenue sur la question et j'ai fait des tests en changeant le css dans LFE.
Et ça marche : maintenant, j'ai mes petits clusters en mauve cerclé de violet. Comme ya jamais ces couleurs sur mes fonds de carte, on les voit bien. Pas encore très élégant, mais si j'étais une artiste, ça se saurait... J'accueille volontiers les suggestions.

Voici mon code css

Code:

/*couleur cluster small OSM 1er niveau, à la place du vert*/
.marker-cluster-small {
  background-color: rgba(70, 27, 126, 0.6) !important;
  }/*cercle violet*/
.marker-cluster-small div {
  background-color: rgb(208, 191, 255) !important;
  }/*fond mauve*/

Katryne · 2025-10-30 10:26:15

Hello !
En fait, je ne comprends rien à ce code. Si j'ai réussi, par hasard et par itération, à obtenir des couleurs à peu près correctes pour le cluster small, pour le medium et le large c'est une horreur : en fait avec le jeu des transparences, les couleurs se mélangent et c'est très laid. Je voulais juste des couleurs franches, différentes pour le fond et le cercle des petits ronds, de façon à ce que ce soit parfaitement distinct des couleurs plutôt pastel que l'on rencontre sur les fonds de carte.
Help oskour mayday mayday...

PS : en plus, ce que j'ai pu un peu modifier sur les cartes accueil/album : https://album.chauvigne.info/
n'est pas valable pour la carte globale, qui vit sa vie à elle : https://album.chauvigne.info/osmmap?/categories&v=2

Dernière modification par Katryne (2025-10-30 10:30:09)

polowigo · 2025-10-31 06:55:00

Bonjour Katryne,
N'aurais-tu pas omis le !important dans :

Code:

.marker-cluster-medium div {
    background-color: #EBCB3A;
}

La carte "autonome" est surjavascriptée à mon avis. En tout cas elle affole l'inspecteur de mon pauvre vieux palemoon.
Difficile de comprendre pourquoi elle ne charge pas ton css local.
Essaye de tester aussi en plaçant tes règles dans le custom_css qui a une priorité supérieure à LFE.

Piwigo.org

Annonce

#1 2025-03-29 15:06:52

OSM : couleur des clusters

Code:

Code:

#2 2025-03-29 17:00:03

Re: OSM : couleur des clusters

#3 2025-03-29 17:10:16

Re: OSM : couleur des clusters

#4 2025-10-26 23:06:06

Re: OSM : couleur des clusters

Code:

#5 2025-10-30 10:26:15

Re: OSM : couleur des clusters

#6 2025-10-31 06:55:00

Re: OSM : couleur des clusters

Code:

Pied de page des forums