Les 64 images de base
Bloc initial de $8\times 8$ pixels Bloc reconstitué

Cliquez sur les images de base pour les sélectionner, et observez l'évolution du bloc reconstitué.

Comparez le bloc reconstitué quand toutes les images de base sont sélectionnées, et lorsque on retire celles en bas à droite.

Codage JPEG et transformation en cosinus discrète

Le but de cette animation javascript est de mettre en évidence le principe de la transformation en cosinus discrète (en anglais : Discrete Cosine Transform, abrégé en DCT), utilisée dans le codage JPEG des images.

Nous supposons ici que l'image à coder est en niveaux de gris : il suffit donc de donner l'intensité de chaque pixel sous forme d'un nombre.

Dans le codage JPEG, l'image est d'abord découpée en blocs de $8\times 8$ pixels. (Un de ces blocs est représenté en haut à droite.) À chacun de ces blocs est ensuite appliquée cette transformation en cosinus discrète. Grossièrement, cette transformation remplace la donnée des 64 niveaux de gris du bloc par 64 autres coefficients, correspondant chacun à l'une des 64 images de base représentées dans le carré en haut à gauche. (Pour plus de détails, voir ci-dessous.) La reconstitution du bloc à décrire s'effectue en multipliant chaque image de base par le coefficient correspondant, et en additionnant les résultats. Cette reconstitution est représentée dans le carré en bas à droite.

Quel est l'intérêt de remplacer les 64 niveaux de gris par 64 autres nombres ? On a l'impression de ne pas avoir gagné grand chose...

Pourtant, le codage par DCT procure un avantage essentiel pour la compression du fichier image. Il était bien difficile, si l'on voulait diminuer la taille du fichier représentant l'image, de supprimer un pixel en ne donnant pas son niveau de gris : pas question d'avoir une image avec des trous ! En revanche, oublier la contribution de certaines des images de base peut se faire sans trop de dommage, et c'est ce qu'illustre l'animation.

En cliquant sur les images de base, on sélectionne celles qui sont prises en compte dans la reconstitution. Quand aucune n'est sélectionnée, la reconstitution est uniformément grise, et si toutes sont sélectionnées, la reconstitution redonne fidèlement le bloc de départ. On s'aperçoit que les 64 images de base ne portent pas toutes une information de même importance : celle portée par les images de base en haut à gauche est essentielle, et ne pas les prendre en compte se traduit par une nette différence entre le bloc source et le bloc reconstitué. En revanche, négliger celles qui sont en bas à droite n'influe pas énormément sur l'aspect du bloc reconstitué.

La compression JPEG utilise ce principe : n'utiliser qu'une partie bien choisie de l'information contenue dans les coefficients de la DCT afin de coder l'image. Il s'agit donc d'une compression avec perte : certains coefficients sont complètement (ou en partie) négligés.

Cette animation javascript a été conçue pour illustrer la conférence Traitement numérique de l'image.

Principe mathématique de la DCT

Chaque bloc $8\times 8$ de l'image est interprété comme une fonction $$F\ : \{0,\ldots,7\}\times\{0,\ldots,7\} \to\mathbb{R},$$ qui au pixel de coordonnées $(x,y)$ associe l'intensité de ce pixel. L'ensemble de ces fonctions constitue un espace vectoriel sur $\mathbb{R}$ de dimension 64, et on le munit du produit scalaire $$\langle F,G\rangle := \sum_{0\le x,y\le 7}F(x,y)G(x,y).$$ La base de fonctions utilisées pour le codage JPEG est formée par une famille orthonormale pour ce produit scalaire. Ce sont les fonctions $F_{u,v}$, $0\le u,v\le 7$, définies par $$ F_{u,v}(x,y) := N(u)N(v) \cos\frac{(2x+1)u\pi}{16} \cos\frac{(2y+1)v\pi}{16},$$ où N(u) et N(v) sont des constantes de normalisation. Ces fonctions sont représentées dans l'animation ci-dessus par le carré des 64 images de base.

La fonction $F$ correspondant au bloc à décrire peut alors s'écrire $$ F = \sum_{0\le u,v\le 7}c_{u,v}F_{u,v},$$ où les coefficients $c_{u,v}$ sont les produits scalaires de $F$ avec les fonctions $F_{u,v}$. On peut donc remplacer la donnée des intensités $F(x,y)$ par celle des coefficients $c_{u,v}$ : ils contiennent exactement la même information. Ce passage des intensités aux coefficients $c_{u,v}$ est précisément ce que l'on appelle la transformation en cosinus discrète.