Palettes de couleurs

Germain Salvato Vallverdu

Systèmes de codage des couleurs

Comment définir une couleur en informatique ?

  • RGB/RVB : Red Green Blue, synthèse additive
  • HSL/TSL : Hue Saturation Light
  • CMYK/CMJN : Cyan Magenta Yellow Black, synthèse soustractive

RGB

Red Green Blue

  • Basé sur la synthèse additive des couleurs
  • On indique "la quantité" de chaque couleur
  • Chaque couleur est définie par un nombre entre 0 et 255 (8 bits = 1 octet)

additive

  • rouge (255, 0, 0)
  • vert (0, 255, 0)
  • bleu (0, 0, 255)

RGB and HTML color codes

HTML color codes are another way to define a RGB color using an hexadecimal numeral system.

  • HTML color starts with a # character
  • the folowing 6 characters defines the intensity of red, green and blue colors
  • each pair correspond to a number in hexadecimal numeral system from 0 to FF (255)

example : #2D85C9 (48, 133, 201)

  • 2D 48
  • 85 133
  • C9 201

RGB et RGBA

  • extension de RGB
  • a pour alpha (canal alpha)
  • RGBA = RGB + opacité
  • l'opacité est définie entre 0 (transparent) et 1 (opaque)

rgba

HSL

Hue, staturation, light - Teinte, saturation, luminosité

  • Plus proche de la perception humaine de la couleur
  • La teinte est définie sur une roue par un angle entre 0 et 360°
  • La saturation et la luminosité sont définies entre 0 et 100%

CYMK / CMJN

Cyan Yellow Magenta Black

  • Basé sur la synthèse soustractive
  • Utilisé en imprimerie

synthèse soustractive

Les palettes de couleurs

Différents types de palettes

  • Palettes qualitatives (ou par catégorie)
  • Palettes sequential, échelle régulière
  • Palettes divergentes

Palettes qualitatives

  • Pour distinguer différents groupes de données qui n'ont pas de relation entre eux.

Exemple

plot_cmap("Dark2", 4)

Palettes séquentielle

  • Utilisation d'une échelle de couleur
  • Il existe un ordre entre les données

Exemple

plot_cmap("Blues", 8)

Palettes séquentielle

Faire l'inverse

Dans matplotlib le suffixe _r permet d'inverser le sens.

plot_cmap("Blues_r", 8)

Palettes divergentes

  • utiles lorsqu'une valeur centrale joue un rôle spécifique.
  • Valeurs réparties autour de zéro

Exemple

plot_cmap("coolwarm", 9)

Construire une palette de couleur

Quels outils

Avec matplotlib

Avec matplotlib

matplotlib colormaps

  • les colormaps de matplotlib sont dans le module matplotlib.cm
  • Une colormap permet de faire correspondre un nombre à une couleur

Exemple colormap summer

plot_cmap(plt.cm.summer, 6)

Avec matplotlib

La colormap retourne une couleur de type rgba.

plt.cm.summer(X=42)
(0.16470588235294117, 0.58235294117647063, 0.40000000000000002, 1.0)
  • X est un nombre ou une liste de nombre
  • X doit être compris entre 0 et plt.cm.colormap.N
  • On peut indiquer l'opacité

print("Max val = ", plt.cm.summer.N)
palette = plt.cm.summer(X=[1, 50, 100, 200], alpha=.6)
print(palette)
show_colors(palette)

Max val =  256
[[ 0.00392157  0.50196078  0.4         0.6       ]
 [ 0.19607843  0.59803922  0.4         0.6       ]
 [ 0.39215686  0.69607843  0.4         0.6       ]
 [ 0.78431373  0.89215686  0.4         0.6       ]]

Avec matplotlib

  • On peut changer les bornes avec Normalize

normalize = mpl.colors.Normalize(vmin=-5, vmax=5)
palette = plt.cm.summer(X=normalize([-4, -2, 0, 2, 4]), alpha=1)
print(palette)
show_colors(palette)

[[ 0.09803922  0.54901961  0.4         1.        ]
 [ 0.29803922  0.64901961  0.4         1.        ]
 [ 0.50196078  0.75098039  0.4         1.        ]
 [ 0.70196078  0.85098039  0.4         1.        ]
 [ 0.90196078  0.95098039  0.4         1.        ]]

Avec colorlover

Avec colorlover

Colorlover met à disposition des fonctions pour gérer une palette de couleurs

import colorlover as cl
  • cl.colorsys : conversion entre systèmes de couleur
  • cl.scales : les échelles de couleur
  • cl.to_HTML : affichage du échelle de couleur

Il faut utiliser cl.scales de la façon suivante :

cl.scales["nombre"]["type"]["nom"]
  • nombre est un nombre entier 3 et 12 inclus
  • type est le type de palette : div, seq ou qual
  • nom est le nom de la palette.

Toute les palettes ne sont pas disponnibles pour toutes les combinaisons.

palettes avec colorlover

Par exemple, voici les palettes divergentes à 4 couleurs. On utilise cl.to_html pour convertir en langage html, et HTML pour demander au notebook d'afficher le résultat du code HTML et voir la palette.

from IPython.display import HTML # notebook integration
HTML(cl.to_html(cl.scales["4"]["div"]))
BrBG
PiYG
RdYlBu
RdGy
RdBu
PuOr
PRGn
RdYlGn
Spectral

On affiche maintenant les couleurs de la palette PuOr :

cl.scales["4"]["div"]["PuOr"]
['rgb(230,97,1)', 'rgb(253,184,99)', 'rgb(178,171,210)', 'rgb(94,60,153)']

palettes avec colorlover

Conversion en triplet RGB

Pour les utiliser avec matplotlib il faut les convertir en triplet RGB.

Une fonction est prévu pour cela dans colorlover.

cl.to_numeric(cl.scales["4"]["div"]["PuOr"])
[(230.0, 97.0,    1.0),
 (253.0, 184.0,  99.0),
 (178.0, 171.0, 210.0),
 ( 94.0,  60.0, 153.0)]

Avec seaborn

Avec seaborn

La documentation est très claire : seaborn color palettes 

import seaborn as sns

seaborn met à disposition plusieurs fonctions pour construire et afficher une palette de couleurs. Par exemple, pour afficher la palette courante :


current_palette = sns.color_palette()
sns.palplot(current_palette)

Les différentes palettes seaborn

Il existe plusieurs fonctions pour construire sa propre palette.

Palette qualitative

sns.palplot(sns.color_palette("husl", 8))

Les différentes palettes seaborn

Palette Séquentielle

sns.palplot(sns.light_palette("violet", 4))

Les différentes palettes seaborn

Palette divergente

sns.palplot(sns.diverging_palette(220, 20, n=5))

Conclusion

  • Les couleurs sont là pour faciliter la lecture et l'interprétation et non pour faire jolie
  • Attention à la cohérence des couleurs entre des données équivalentes

Retrouver ces exemples dans un notebook jupyter


colorscale.ipynb

Remove - to improve

The data vs ink ratio must be more than 1

Merci de votre attention