Configurer l'application Radar

Le Radar compare quelques éléments sur plusieurs critères à la fois : chaque critère est un axe qui part du centre, chaque élément une ligne fermée qui relie ses valeurs sur les axes. D'un coup d'œil, on voit le profil de chaque élément, où il se démarque et où il ressemble aux autres : des régions selon la classe énergie de leurs logements, des communes selon quelques indicateurs, des produits selon leurs caractéristiques.

Les visualisations de ce cours

Le radar de ce cours, en fonctionnement : survolez un point pour lire sa valeur, ajoutez une région avec la barre de recherche ou retirez-en une.

La part de chaque classe énergie, de A à G, parmi les diagnostics de performance énergétique (DPE) des logements, par région. À l'ouverture, le radar montre les régions en tête sur au moins un axe, avec la moyenne des 13 régions en pointillé : la Corse compte le plus de logements bien classés, la Bourgogne-Franche-Comté le plus de passoires thermiques (F et G). Les couleurs sont celles du thème du portail.

Les exemples de ce cours s'appuient sur un seul jeu de données, Classes énergie des logements diagnostiqués par région : une ligne par région de France métropolitaine, avec la part (en %) de chaque classe énergie parmi les diagnostics de performance énergétique réalisés depuis juillet 2021. Il est calculé à partir des plus de 15 millions de diagnostics du jeu DPE Logements existants (depuis juillet 2021) de l'ADEME.

1. Les données

La section Données désigne les données du radar :

  • [1] Jeu de données : le jeu à représenter. Il doit avoir une colonne portant le concept Libellé, qui nomme les éléments, et au moins trois colonnes numériques, les critères ;
  • [2] Identifiant des éléments : voir 3.2 ;
  • [3] Filtres prédéfinis : les lignes prises en compte. Une ligne écartée n'est ni tracée, ni proposée par la recherche, ni comptée dans les échelles et la moyenne. Les filtres sont communs à la plupart des visualisations et décrits dans le cours Créer et gérer une visualisation.

Le radar n'agrège pas les données : chaque ligne du jeu est un élément à comparer, et chaque critère une colonne de cette ligne. Pour comparer des régions à partir d'un jeu qui compte une ligne par diagnostic, préparez d'abord un jeu d'une ligne par région, comme ici : 13 lignes calculées à partir de 15 millions.

Section Données de la configuration du Radar
Le jeu de données, la colonne identifiant et les filtres prédéfinis

2. Critères et éléments affichés

La section Rendu règle ce que montre le radar :

  • [1] Critères de comparaison : voir 2.1 ;
  • [2] Éléments affichés : voir 2.2 ;
  • [3] Recherche d'éléments : voir 3.1 ;
  • [4] Afficher la moyenne : voir 4.1 ;
  • [5] Comparaison globale : voir 4.2 ;
  • [6] Minimum des valeurs à 0 : voir 4.3.

Les couleurs se règlent en bas de la même section (voir 5).

Section Rendu de la configuration du Radar
Critères, éléments affichés, recherche, moyenne, échelle et centre du radar

2.1 Critères de comparaison

Chaque critère est une colonne numérique du jeu, et devient un axe du radar, dans l'ordre où vous les choisissez, en partant du haut et dans le sens des aiguilles d'une montre. Le titre de la colonne sert de libellé à l'axe : donnez à vos colonnes des titres courts (ici Classe A à Classe G). Il en faut au moins trois ; au-delà d'une dizaine, les libellés se chevauchent.

Chaque axe a sa propre échelle, du minimum au maximum du critère : le radar compare des profils, pas des valeurs absolues. Des critères d'unités différentes (une population, un pourcentage, un revenu) peuvent donc se côtoyer ; la valeur exacte s'affiche au survol d'un point.

2.2 Éléments affichés

Les Éléments affichés sont les lignes tracées à l'ouverture du radar :

  • Éléments ayant une valeur maximum sur un axe (par défaut) : pour chaque critère, l'élément qui y a la plus forte valeur. Un même élément peut être en tête sur plusieurs axes : ici, la Corse l'est sur A, B et C, et le radar trace quatre régions pour sept axes ;
  • Tous les éléments retenus par les filtres : pour un petit jeu, ou un jeu réduit par les filtres prédéfinis, par exemple trois régions à comparer. Au-delà de 20 éléments, seuls les 20 premiers par ordre alphabétique sont tracés ; déjà avec les 13 régions, le radar devient illisible ;
  • Aucun élément : le radar s'ouvre vide et le visiteur choisit lui-même les éléments, avec la barre de recherche (voir 3.1).
Les trois modes des éléments affichés
Valeur maximum sur un axe, tous les éléments retenus par un filtre ou sans filtre, aucun élément

3. Recherche et sélection du visiteur

3.1 Barre de recherche

Avec Recherche d'éléments, une barre de recherche s'affiche au-dessus du radar. Le visiteur y saisit au moins deux caractères, choisit un élément dans la liste des résultats, et le radar l'ajoute ; la croix d'une étiquette retire l'élément. Les éléments affichés à l'ouverture apparaissent déjà comme étiquettes : le visiteur part de ce choix et le modifie. La recherche respecte les filtres prédéfinis : un élément écarté n'est jamais proposé.

La barre est utile dès que le jeu compte plus d'éléments que le radar n'en montre, et indispensable avec Aucun élément (voir 2.2). Sans elle, le radar montre seulement les éléments choisis par la configuration, ou ceux d'un lien partagé (voir 3.2).

Barre de recherche et sélection du Radar
Recherche d'une région, régions ajoutées, lien partagé, identifiant par défaut

3.2 Sélection partagée et identifiant

Le choix du visiteur est repris dans l'adresse de la page : un lien copié rouvre le radar avec les mêmes éléments, même sans barre de recherche (troisième image). Les éléments affichés à l'ouverture, eux, ne sont pas dans l'adresse : ils se recalculent à chaque visite.

Ce choix filtre aussi les autres visualisations de la même page ou du même tableau de bord dont les données ont une colonne portant le même concept que l'identifiant ; le radar lui-même garde ses échelles et sa moyenne.

L'Identifiant des éléments est la colonne qui distingue un élément d'un autre dans ce choix. Par défaut, c'est la colonne au concept Libellé : ce concept très général filtrerait toute visualisation de la page qui a une colonne de libellés, quel qu'en soit le sujet. Choisissez plutôt une colonne au concept précis, partagé avec les données voisines : ici le Code région, pour ne filtrer que les visualisations qui portent sur les régions, comme une carte. Une colonne de code distingue aussi des éléments homonymes (deux bureaux de vote de même nom) ; le radar ajoute alors le code au nom, dans les étiquettes et dans la légende (quatrième image, avec le libellé par défaut, sans code).

4. Lecture du radar

4.1 Moyenne

Afficher la moyenne ajoute une ligne grise en pointillé, Moyennes dans la légende : la moyenne de chaque critère, sur tout le jeu filtré avec la comparaison globale (ici les 13 régions), sur les seuls éléments affichés sans elle. C'est un repère : une région au-delà de la moyenne sur un axe s'y démarque. La moyenne est une moyenne simple des lignes, sans pondération : ici, la Corse compte autant que l'Île-de-France.

Le Radar sans et avec la moyenne
La moyenne des 13 régions, en pointillé

4.2 Comparaison globale

La Comparaison globale règle l'échelle des axes :

  • cochée, chaque axe va du minimum au maximum du critère sur tout le jeu (filtres appliqués) : un élément se situe par rapport à l'ensemble, et le radar garde la même échelle quand le visiteur ajoute ou retire un élément. Ici, la Corse fixe le haut de l'axe A : la Bretagne, avec 1,9 % de logements en classe A, reste près du centre ;
  • décochée (par défaut), les axes s'adaptent aux seuls éléments affichés : les écarts entre eux ressortent mieux, mais l'échelle change à chaque ajout ou retrait. La Bretagne, en tête des trois régions affichées sur l'axe A, en touche le bord.

Cochez-la dès que le visiteur choisit ses éléments : un radar qui change d'échelle à chaque clic se lit mal.

Le Radar avec et sans comparaison globale
La Bretagne sur l'axe A, à l'échelle des régions affichées ou des 13 régions

4.3 Minimum des valeurs à 0

Avec Minimum des valeurs à 0 (par défaut), le centre du radar vaut 0 sur chaque axe : la distance au centre est proportionnelle à la valeur. Décoché, le centre vaut la plus petite valeur du critère : les écarts ressortent davantage, mais un point au centre n'est pas à zéro, il est seulement le plus bas. Ici, l'Île-de-France semble n'avoir aucun logement en classe A, alors qu'elle en a 0,3 %. Gardez l'option cochée pour des parts ou des effectifs.

Le Radar avec le centre à 0 ou à la plus petite valeur
Trois régions, centre à 0 ou à la plus petite valeur

4.4 Survol, légende et accessibilité

Le survol d'un point affiche une infobulle : le critère, l'élément et sa valeur réelle, et non sa position sur l'échelle de l'axe. Un clic sur un élément de la légende masque sa ligne, un second clic la réaffiche. Pour les lecteurs d'écran, le radar est doublé d'un tableau des valeurs, invisible à l'écran : un élément par ligne, un critère par colonne, la moyenne en premier.

5. Couleurs

La Définition du style, en bas de la section Rendu, donne une couleur à chaque élément ; la moyenne reste toujours grise :

  • [1] Type de palette : par défaut, Teintes autour d'une couleur : la couleur de départ pour le premier élément, puis des teintes réparties régulièrement sur le cercle chromatique, autant que d'éléments affichés. Toutes gardent la luminosité de la couleur de départ, donc le même contraste sur le fond ;
  • [2] Type de couleur : Thème (par défaut) ou Personnalisée ;
  • [3] Couleur : la couleur du thème du portail, Primaire (par défaut), Secondaire ou Accent, qui suit le portail où le radar est affiché ; ou, en couleur personnalisée, une couleur du nuancier.

Gardez les teintes autour d'une couleur du thème : le radar s'accorde au portail, clair ou sombre, et chaque élément a une teinte bien distincte. Une couleur personnalisée ne se justifie que si elle a un sens pour le lecteur, comme la couleur d'une marque.

Les palettes qualitative, divergente et séquentielle restent proposées, avec Inverser et un Sous-ensemble clair ou foncé pour les deux dernières. Leurs couleurs ne suivent pas le thème. Une palette séquentielle ou divergente suggère un ordre entre les éléments : réservez-la à des éléments ordonnés, comme des années, jamais à des régions.

Définition du style dans la configuration du Radar
Teintes autour de la couleur primaire du thème
Palettes de couleurs du Radar
Teintes autour des couleurs Primaire et Accent du thème, palettes qualitative et séquentielle

Si vous avez des remarques sur ce cours, n'hésitez pas à nous les communiquer.