Geoproject

Wiki
des utilisateurs

Wiki des utilisateurs

Filtre printanier

Comment représenter le printemps sur les cartes d’OpenStreetMap ? Il suffit comme on l’a fait pour le filtre automnal de créer un filtre avec des couleurs du printemps et les appliquer à toutes les cartes et cartes des marqueurs en copiant et collant le code proposé ci-dessous dans le champ “CSS personnalisé” de WordPress :

Pour toutes les cartes du récit

/* Appliquer le filtre printanier à tous les éléments dont l’identifiant commence par ‘map-‘ */
[id^=”map-“] {
filter : sepia(0.3) saturate(2) hue-rotate(30deg) brightness(1.2) contrast(1.1) ;
}
Pour toute les cartes des marqueurs du récit
/* Appliquer le filtre printanier à tous les éléments dont l’identifiant commence par ‘map-marker-‘ */
[id^=”map-marker-“] {
filter : sepia(0.3) saturate(2) hue-rotate(30deg) brightness(1.2) contrast(1.1) ;
}

Intentions

Notre intention était plutôt d’éclaircir les fonds de cartes pour valoriser les marqueurs sans essayer de forcer leurs couleurs. Il s’agissait de conserver la gamme chromatique définie par le créateur des marqueurs (Christophe) tout en faisant le lien avec celle d’OPS et qui ne lui correspondait pas.

Voici les nuances qui ont été apportées

  • sepia(0.3) : Applique une teinte sépia légère pour adoucir les couleurs.
  • saturate(2) : Augmente la saturation pour rendre les couleurs plus vives.
  • hue-rotate(30deg) : Fait pivoter les teintes de couleur de 30 degrés pour ajouter une tonalité printanière.
  • brightness(1.2) : Augmente la luminosité pour rendre l’image plus claire.
  • contrast(1.1) : Augmente légèrement le contraste pour des couleurs plus définies.

La pratique

(Avant le code CSS) Avec les couleurs standards d’OpenStreetMap, et celles définies pour les marqueurs par Christophe :

(Après l’application du filtre) : le résultat avec le changement de la couleur dite printanière :