====== Mise en évidence d'un critère sélectionné sur carte et liste ======

===== Besoin/Objectif =====
Améliorer la visibilité des données sur la carte du module Synthèse (= Observations) selon un critère (précision, période, enjeux...) sélectionné par l’utilisateur. 

===== Ressources =====
  * Tickets GeoNature Github :
    * [[https://github.com/PnX-SI/GeoNature/issues/3258#issuecomment-2488502247#3258| #3258 - [SYNTHESE] Mise en évidence d'un critère sélectionné sur la carte et sur la liste de résultats]]
    * [[https://github.com/PnX-SI/GeoNature/issues/1093| #1093 - Synthèse : affichage de mailles et observations géo-confidentielles]]
    * [[https://github.com/PnX-SI/GeoNature/issues/968| #968v - Synthèse : colorer les données invalides]]

===== À faire =====
  * <todo>Voir le mécanisme de coloration utilisé dans le module Validation</todo>

===== Questions =====
  * **Comment gère-t-on le cas où un "point" sur la carte contient plusieurs observations dont les valeurs du critère sélectionné sont différentes ?**
    * Utiliser une couleur "neutre" (gris ?) dans un premier temps car la liste des observations où nous colorerons l'icône "i" permettra de faire la distinction.
    * Autres solutions de coloration, en fonction : 
      * de l'observations de la plus récente
      * du pourcentage le plus élevés d'observations ayant la même valeur de critère
      * de l'ordre de la liste des valeurs


===== Principe général =====
Dans le module Synthèse (= Observations), un utilisateur doit pouvoir sélectionner, via une liste déroulante intégrée à la carte, un critère pour lequel il souhaite visualiser un affichage différencié sur la carte. L'indication de la valeur du critère sélectionné pourra être également reprise au niveau de la liste des observations et sur la fiche d'une observation.

Sur la carte, nous envisageons d'utiliser dans un premier temps des couleurs distinctes pour identifier les différentes valeurs des critères sur la carte. La couleur peut en effet facilement être utilisé à la fois pour les points et les polygones. Si cela s'avère envisageable des icônes pourront être utilisé pour différencier les valeurs mais cela pose des problèmes pour les polygones.
Au niveau de la liste des observations, un surlignage et/ou une icône peuvent être utilisé.
Dans la fiche observation, un icône, une couleur et/ou un texte pourrait servir à la mise en évidence du critère.

Nous rendrons paramétrable :
  * l'activation de cette fonctionnalité 
  * le choix des critères 
  * l'attribution des couleurs aux valeurs des critères. Si possible nous proposerons également la possibilité de définir des icônes aux valeurs et pour chaque critère un niveau d'opacité et l'utilisation ou pas d'un contour.

Les critères envisagés sont : 
  * précision (champ ''precision'') : avant (précise) / après (approximative) un niveau de précision en mètre particulier.
  * période (champ ''date_max'') : avant (ancienne) / après (récente) une année (= date) particulière. Une alternative serait un affichage différencié par décennie.
  * enjeux réglementaire (protection) : enjeu réglementaire (Oui) / pas d'enjeu réglementaire (Non)
  * menace (listes rouges) : enjeu de menace (Oui) / pas d’enjeu de menace (Non).

Mais les critères suivant ont également étaient mentionné dans les tickets du dépôt GeoNature :
  * type de l'observations (''id_nomenclature_observation_status'') : présence, absence.
  * statut de validation (''id_nomenclature_valid_status'') : douteuse, probable, certaine...

===== Exemple d'OpenObs =====

{{ :fonctionnalites:geonature:openobs_exemple.png?600| Carte OpenObs avec outil de sélection d'un critère d'affichage}}

OpenObs permet de sélectionner des critères pour différencier les observations affichées sur la carte.\\ 
Une liste intitulé "Couleur par" permet de sélectionner le critère d'affichage des observations sur la carte. Toutes les observations sont représentées par des points dont la couleur correspond à une valeur du critère.

L'interface permet à l'utilisateur de définir la taille du point, sa transparence et l'affichage d'un contour ou pas.

La légende peut être affiché ou réduite pour prendre moins de place sur la carte. Il est également possible de sélectionner via des cases à cocher dans la légende les valeurs à afficher. Les critères proposés par OpenObs peuvent potentiellement contenir des dizaines de valeurs, la légende possède donc une liste déroulante.

Le critère "Grille de densité des enregistrements" correspond à l'actuel mode d'affichage "Mailles" de la carte de GeoNature.

{{ :fonctionnalites:geonature:openobs_detail.png?600 | Détail de l'outil OpenObs de sélection d'un critère d'affichage}}\\ 


===== Proposition d'implémentation =====
Nous envisageons de faire évoluer le mode d'affichage "Mailles" des données actuellement présent sur la carte.\\ 
D'un système de coche simple, nous le transformerions en **liste de bouton radio** permettant de sélectionner une entrée unique dans la liste qui s'ouvrirait. Le **même fonctionnement que la sélection du fond cartographique** sera utilisé ici.

La liste des modes d'affichage serait représentée par **une icone représentant une liste indiquant "Mode d'affichage" au survol**. 
Pour l'icône d'accès aux modes d'affichage, celui de Fontawesome représentant une liste ''fa-list'' peut convenir : <html><i class="fa fa-list fa-lg" aria-hidden="true"></i></html>.
Mais une icône ressemblant à celle du [[https://www.geoportail.gouv.fr/carte|Geoportail]] me semble plus expressive : {{:fonctionnalites:geonature:geoportail_icone_legende.png|}}

Via le **paramètre de configuration ''SYNTHESE.MAP_CRITERIA_LIST''**, sur le même principe que l'ajout des fonds cartographiques, il sera possible d'ajouter de nouveaux éléments à la liste des modes d'affichage. Ce paramètre sera spécifique au module Synthese. Sa présence activera l'apparition de l'icone "modes d'affichage".
Chaque critère d'affichage sera associé à un champ de la vue ''gn_synthese.v_synthese_for_web_app'' avec possibilité d'affecté une couleur en fonction d'une **correspondance exacte** (champs de nomenclatures ; exemples ''id_nomenclature_observation_status'', ''id_nomenclature_valid_status'') de sa valeur ou de son appartenance à une **classe "numérique"** (champs numérique ou assimilé, exemple ''precision'', ''date_fin''). La valeur du critère sera renvoyé par le backend via le web service unique de la Synthese. La coloration sur la carte sera gérée par Leaflet à l'aide des informations présentes dans le GeoJson.

La liste des modes d'affichage apparaîtra également sur la carte si le paramètre ''AREA_AGGREGATION_ENABLED'' est à true. Dans tous les cas, la liste contiendra une entrée nommée ''Défaut'' correspondant à l'affichage par défaut de GeoNature sous forme de cluster puis de cercle/polygone bleu représentant un emplacement d'une ou plusieurs observations. Cette entrée sera cochée par défaut sauf si le paramètre ''AREA_AGGREGATION_BY_DEFAULT'' est à true. Dans ce dernier cas, c'est l'entrée ''Mailles'' correspondant à l’agrégation des observations par mailles qui sera sélectionnée.

Concernant les critères "enjeux réglementaire" et "menaces" nous envisageons de rajouter des champs spécifiques à la vue ''gn_synthese.v_synthese_for_web_app'' dans le cadre de notre installation de GeoNature afin de les traiter sur le même principe qu'un champ de type ''classes''.

Pour la liste des observations, nous proposons de colorer l'icône "i" de chaque observations en fonction du critère sélectionné.

Dans le cas des **géométries regroupant des observations aux valeurs contradictoires** vis à vis du critère proposé. Nous proposons dans un premier temps de les afficher à l'aide d'une couleur "neutre" (gris par exemple ; éventuellement configurable). Un clic sur la géométrie affichera la liste des observations surlignés en vert en tête de liste des observations où la couleur de l'icone "i" permettra de les distinguer les valeurs des différentes observations en fonction du critère sélectionné.

Au niveau de la fiche d'observation, nous testerons l'ajout au niveau de l'entête d'une icone colorée avec information apparaissant au survol.
==== Détail du paramètre SYNTHESE.MAP_CRITERIA_LIST ====

Ce paramètre sera une liste de dictionnaire où chaque dictionnaire correspondra à un critère. Pour chaque critère (= dictionnaire) nous aurons les champs suivant :
  * ''code'' (chaine) : code alphanumérique du critère utilisé pour identifier ce critère d'un point de vue technique. Ne devrait pas être utilisé pour l'affichage ou vis à vis de l'utilisateur. Devrait être unique dans la liste et devrait éviter de contenir des caractères spéciaux.
  * ''label'' (chaîne) : intitulé par défaut du critère à utilisé. Servira à l'affichage dans la liste des modes d'affichage.
  * ''type'' (chaîne) : le type de critère parmi : ''nomenclatures'', ''classes''. Le critère de type ''nomenclatures'' est à utiliser avec tous les champs ''field'' correspondant à une nomenclature ou à un champ texte pour lequel on veut réaliser une coloration en fonction d'une valeur précise. Le critère de type ''classes'' est à utiliser avec les champs de type numérique ou date pour lesquels on veut établir des classes numériques de valeurs.
  * ''field'' (chaîne) : le nom du champ présent dans la vue ''gn_synhtese.v_synthese_for_web_app'' à utiliser pour le critère.
  * ''activate'' (booléen, défaut : false) : indique si critère est à afficher (''true'') ou pas (''false'') dans la liste des modes d'affichage.
  * ''default'' (booléen, défaut : false) : indique si ce critère doit être utilisé par défaut (''true'') ou pas (''false'') comme mode d'affichage. Le premier critère à ''true'' trouvé dans la liste sera pris en compte.
  * ''values'' (liste de dictionnaire) : liste de dictionnaire correspondant aux valeurs possibles du critère. Chaque dictionnaire d'une valeur pourra contenir les champs :
    * ''value'' (liste de chaines | chaîne) : dans le cas du type ''nomenclature'' contiendra un code de la nomenclature, champ ''cd_nomenclature'' (Note :  tester la possibilité de saisir plusieurs valeurs pour éviter la répétition des entrées avec la même couleur et les mêmes styles -> cas de la liste de chaines). Dans le cas du type ''classes'', il contiendra la valeur minimum de comparaison à utiliser vis à vis du contenu du champ ''field''. Un objet sur la carte prendre la couleur correspondante si sa valeur dans le champ ''field'' est supérieure ou égale à la valeur indiquée. L'ordre des entrées de la liste ''values'' est important car la couleur est attribué dès que l'opération de comparaison est vraie. 
    * ''label'' (chaîne) : intitulé par défaut de la valeur. Servira à l'affichage dans la légende.
    * ''color'' (chaîne) : code hexadécimal de la couleur de la valeur. La valeur sera utilisée pour le style ''fillcolor''.
    * ''icon'' (chaîne) : indiquer une icone à l'aide de son nom. Possibilité d'utiliser des icônes : [[https://fontawesome.com/v4/icons/|Fontawsome]], [[https://fonts.google.com/icons?hl=fr|Angular Material]] ou personnalisé SVG (à tester). La pertinence de l'utilisation d'icone reste à déterminer.
    * ''styles'' (dictionnaire) : contient un dictionnaire des clés et valeurs de styles à utiliser en complément de la couleur de remplissage. Les [[https://leafletjs.com/reference.html#path-option|styles disponibles]] sont ceux de l'option ''style'' de [[https://leafletjs.com/reference.html#geojson|l'objet GeoJson]] de Leaflet.