21
1 Représentation et traitement des images en OpenGL

1 Représentation et traitement des images en OpenGL

Embed Size (px)

Citation preview

Page 1: 1 Représentation et traitement des images en OpenGL

1

Représentationet

traitement des imagesen

OpenGL

Page 2: 1 Représentation et traitement des images en OpenGL

2

Les images sont représentées à l’aide d’un tableau de « pixels » (noté « pixmap »)où chaque « pixel » désigne une couleur.

Ces tableaux de « pixels » peuvent être emmagasinés en mémoire et même copiésd’un endroit à un autre en mémoire.

Lorsqu’un tableau de « pixels » est stocké dans la mémoire d’entretien, chaquevaleur numérique d’un « pixel » est convertie en un point d’une certaine couleurà l’écran.

Rappelons qu’un « pixel » de b bits peut représenter 2b couleurs différentes. Enpratique, un « pixel » est représenté de différentes façons :

b Description

Désigné sous le nom de «bitmap», il se comporte comme un masque.1

Un « pixel » représente 256 niveaux de gris: 0 (noir) à 255 (blanc)8

Un « pixel » représente un indice dans un tableau de couleurs.On peut donc représenter en même temps 256 couleurs différentes.

8

Un « pixel » correspond à 3 octets représentant resp. les composantesrouge, vert et bleu d’une teinte.

24

Un « pixel » correspond à 4 octets représentant de nouveau lescomposantes rouge, vert et bleu d’une teinte, ainsi que le caractèreopaque du « pixel » (0 : complètement transparent, 255 : opaque).

32

Page 3: 1 Représentation et traitement des images en OpenGL

3

Bitmaps et polices de caractères

Un bitmap est un tableau rectangulaire de 0 et de 1 servant de masque de dessinpour une région rectangulaire de la fenêtre : si la couleur active est le rouge et le bitmap contient un 1, le pixel correspondant est remplacé par un pixel rouge (ou combiné avec un pixel rouge, selon les opérations prévues). S’il contient un 0, le contenu du pixel n’est pas affecté.

L’utilisation la plus courante des bitmaps consiste à dessiner des caractèresà l’écran.

void glRasterPos{2 3 4}{s i f d}(TYPE x, TYPE y, TYPE z, TYPE w);void glRasterPos{2 3 4}{s i f d}v(TYPE * coords);

Permet de choisir le « pixel » en position (x, y, z, w) comme étant le « pixel »à la position courante. z prend implicitement la valeur 0 et w la valeur 1.

Les coordonnées de position sont transformées en coordonnées d’écran exac-tement de la même manière que celles associées à une commande glVertex*().

Après transformation, si la position est à l’extérieur de la fenêtre,elle n’est pas valide.

Ex. : glRasterPos2i(20, 20);

Position active :

Page 4: 1 Représentation et traitement des images en OpenGL

4

Une alternative à glRasterPos*() est glWindowPos*() qui spécifie la positioncourante en coordonnées de fenêtre, sans transformer ses coordonnées par desmatrices de modélisation-visualisation ou de projection, ni découpage.

void glWindowPos{2 3}{s i f d}(TYPE x, TYPE y, TYPE z);void glWindowPos{2 3}{s i f d}v(TYPE * coords);

z est implicitement positionné à 0.

Page 5: 1 Représentation et traitement des images en OpenGL

5

Dessiner le bitmap :

Une fois que vous avez défini la position appropriée, utilisez la commandeglBitmap() pour dessiner les données.

void glBitmap( GLsizei largeur, // Largeur en pixels du bitmap.

GLsizei hauteur, // Hauteur en pixels du bitmap.GLfloat xo, GLfloat yo, // Origine du bitmap.GLfloat xf, GLfloat yf, // Incréments à ajouter une fois

// le bitmap dessiné.const GLubyte * bitmap); // les données sont stockées en caractères

// non signés de 8 bits chacun.

Dessine le bitmap spécifié par bitmap où l’origine est placée à la positionactive. Si la position n’est pas valide, rien n’est dessiné.

Note :

Si vous voulez avancer d’une positionsans rien dessiner, appelez glBitmap()en attribuant la valeur NULL au paramètrebitmap et la valeur 0 à Largeur et Hauteur.

Page 6: 1 Représentation et traitement des images en OpenGL

6

Exemple :

#include <windows.h>#include <GL/glut.h>const GLint L = 880;const GLint H = 640;GLubyte Lettre_F[24] ={

0xc0, 0x00, 0xc0, 0x00, 0xc0, 0x00, 0xc0, 0x00,0xc0, 0x00, 0xff, 0x00, 0xff, 0x00, 0xc0, 0x00,0xc0, 0x00, 0xc0, 0x00, 0xff, 0xc0, 0xff, 0xc0

};void Initialisation(){

glMatrixMode(GL_PROJECTION);glLoadIdentity();gluOrtho2D(0.0, L, 0.0, H);glClearColor(0.0, 0.0, 0.0, 0.0);glClear(GL_COLOR_BUFFER_BIT);glColor3f(1.0, 1.0, 1.0);

}

Remplir l’écran avec la lettre F.

Page 7: 1 Représentation et traitement des images en OpenGL

7

void Affichage(){

GLint k = 0;

// Permet de contrôler les modes de stockage des pixels supportés// par OpenGL.

glPixelStorei(GL_UNPACK_ALIGNMENT, 1);

// La couleur d’affichage du bitmap correspond à la couleur active lors de// l’appel de glRasterPos2i().glRasterPos2i(0, 0);

for (int j = 0; j < H / 16; j++){

for (int i = 0; i < L / 11; i++)glBitmap(10, 12, 0.0, 0.0, 11.0, 0.0, Lettre_F);

glBitmap(0, 0, 0.0, 0.0, - L, 16.0, NULL);};glFlush();

}

Page 8: 1 Représentation et traitement des images en OpenGL

8

void main(int argc, char** argv){

glutInit(&argc, argv);

glutInitWindowSize(L, H);

glutInitWindowPosition(0, 0);

glutCreateWindow("Affichage de la lettre F");

Initialisation();

glutDisplayFunc(Affichage);

glutMainLoop();}

Page 9: 1 Représentation et traitement des images en OpenGL

9

Images

Une image est semblable à un bitmap, mais au lieu de contenir un bit par pixeldans une région de l’écran, l’image peut contenir une couleur complète(R, V, B , A) dans chaque pixel.

Lire, écrire et copier des pixels

glReadPixels( GLint x, GLint y,GLsizei Nb_de_lignes, GLsizei Nb_de_colonnes,GLenum format, GLenum type,GLvoid * pTableau_de_pixels);

Permet de copier en mémoire dans un tableau dynamique pointé par« pTableau_de_pixels » une région rectangulaire de « pixels » en position (x, y)en coordonnées de fenêtre de la mémoire d’entretien dont la dimension est :

Nb_de_lignes X Nb_de_colonnes.Chaque « pixel » représente une couleur selon le modèle défini par format.Le paramètre type indique le type de données de chaque élément.

Ex. :

glReadPixels(0, 0, lignes, colonnes, GL_RGB, GL_UNSIGNED_BYTE, image);

GLubyte image[lignes][colonnes][3];

Page 10: 1 Représentation et traitement des images en OpenGL

10Note : Il se peut par ex. qu’une image soit stockée dans un format, mais que la fenêtre requière un format différent.

(somme pondérée des valeursR, V et B)

Page 11: 1 Représentation et traitement des images en OpenGL

11

Page 12: 1 Représentation et traitement des images en OpenGL

12

glCopyPixels( GLint x, GLint y,GLsizei Nb_de_lignes, GLsizei Nb_de_colonnes,GLenum tampon);

Permet de copier une région rectangulaire de la mémoire d’entretien de dimensionNb_de_lignes X Nb_de_colonnes

dont le coin inférieur gauche est en position (x, y) dans une autre région de lamémoire d’entretien de même dimension dont le coin inférieur gauche correspondau « pixel » à la position courante.Le dernier paramètre renferme GL_COLOR, GL_STENCIL ou GL_DEPTH,spécifiant le tampon d’image utilisé.

glDrawPixels( GLsizei Nb_de_lignes, GLsizei Nb_de_colonnes,GLenum format, GLenum type,const GLvoid * pTableau_de_pixels);

Permet de copier en mémoire d’entretien un tableau de « pixels » de dimensionNb_de_lignes X Nb_de_colonnes

pointé par pTableau_de_pixels. Ce tableau de « pixels » occupe une région demême dimension dans la mémoire d’entretien où le coin inférieur gauchecorrespond au « pixel » à la position courante.

Page 13: 1 Représentation et traitement des images en OpenGL

13

Exemple :

#include <windows.h>#include <GL/glut.h>const GLint L = 640; const GLint H = 640;const GLint Nb_lignes_echiquier = 64; const GLint Nb_colonnes_echiquier = 64;GLubyte tableau_echiquier[Nb_lignes_echiquier][Nb_colonnes_echiquier][3];void Echiquier(){

int i, j, c;for (i = 0; i < Nb_lignes_echiquier; i++){

for (j = 0; j < Nb_colonnes_echiquier; j++){

c = 255;if ((i / 8 + j / 8) % 2 == 0) c = 0;tableau_echiquier[i][j][0] = (GLubyte) c;tableau_echiquier[i][j][1] = (GLubyte) c;tableau_echiquier[i][j][2] = (GLubyte) c;

}}

}

Page 14: 1 Représentation et traitement des images en OpenGL

14

void Initialisation(){

glMatrixMode(GL_PROJECTION);glLoadIdentity();gluOrtho2D(0.0, L, 0.0, H);glClearColor(0.0, 0.0, 0.0, 0.0);glClear(GL_COLOR_BUFFER_BIT);Echiquier();

}

void Affichage(){

glRasterPos2i(320, 320);

glDrawPixels(Nb_lignes_echiquier, Nb_colonnes_echiquier, GL_RGB, GL_UNSIGNED_BYTE, tableau_echiquier);

glFlush();}

Page 15: 1 Représentation et traitement des images en OpenGL

15

Agrandir, réduire ou réfléchir une image.

Permet de fixer les facteurs d’échelle dans les directions x et y où un « pixmap »sera affiché (glDrawPixels() et glCopyPixels()). Ces facteurs valent 1 par défaut.Des facteurs négatifs réfléchissent l’image autour de la position active.

Les « pixmaps » ne sont pas modifiés comme tels; ce sont les imagesproduites qui sont réduites ou agrandies.

Transformations d’images

Opérations de transfert des pixels.

OpenGL peut effectuer plusieurs opérations sur les images pendant que celles-cisont transférées de la mémoire vers la mémoire d’entretien et vice versa.

Voir glPixelTransfer*() et glPixelMap*().

Normalement, chaque pixel d’une image est écrit dans un pixel à l’écran.Vous pouvez cependant agrandir, réduire ou réfléchir une image en utilisantglPixelZoom().

void glPixelZoom(GLfloat sx, GLfloat sy);

Page 16: 1 Représentation et traitement des images en OpenGL

16

Exemple :

void Initialisation(){

glMatrixMode(GL_PROJECTION);glLoadIdentity();gluOrtho2D(0.0, L, 0.0, H);glClearColor(0.0, 0.0, 0.0, 0.0);glClear(GL_COLOR_BUFFER_BIT);glColor3f(1.0, 0.0, 0.0);Echiquier();

}

Page 17: 1 Représentation et traitement des images en OpenGL

17

Exemple :

void Affichage(){

glRasterPos2i(320, 320);

glDrawPixels(Nb_lignes_echiquier, Nb_colonnes_echiquier, GL_RGB, GL_UNSIGNED_BYTE, tableau_echiquier);

glRasterPos2i(480, 480);glPixelZoom(2.0, 2.0);glCopyPixels(320, 320, Nb_lignes_echiquier, Nb_colonnes_echiquier,

GL_COLOR);

glRasterPos2i(160, 160);glPixelZoom(-2.0, -2.0);glCopyPixels(320, 320, Nb_lignes_echiquier, Nb_colonnes_echiquier,

GL_COLOR);

glFlush();}

Page 18: 1 Représentation et traitement des images en OpenGL

18

Appliquer une rotation de 90°, 180° ou 270° à une image : opération élémentaire.

Appliquer une transformation quelconque T à une image.

Le problème est beaucoup plus difficile. L’approche la plus simple est la suivante :pour chaque « pixel » p de l’image transformée, la couleur appropriée estcelle du « pixel » en position T-1(p) de l’image originale.

L’image transformée peut donner lieu à des imprécisions importantes.

Comparaisons entre « pixmaps »

Il s’agit d’analyser les différences entre 2 « pixmaps ».

Remplissage de régions dans un « pixmap »

Nous pouvons dans certains cas identifier dans un « pixmap » des objets élémentairestels que des polygones, des cercles ou encore, une région de « pixels » avec lesmêmes caractéristiques.Nous voulons aussi être capable de colorer de telles régions.

Opérations logiques sur les « pixmaps »

Les tableaux de « pixels » sont combinés entre eux « pixels » par pixels » commeprécédemment mais, cette fois, des opérations logiques sont effectuées bit par bit.

On peut utiliser les opérateurs logiques de C++ ou des fonctions d’OpenGL.

Page 19: 1 Représentation et traitement des images en OpenGL

19

Combinaison de « pixmaps » entre eux

Il s’agit d’effectuer une opération sur 2 tableaux de « pixels », « pixel » par « pixel »,comme suit :

C[i][j] A[i][j] B[i][j] pour tout i, j où désigne l’opération à effectuer.

Exemples :1. Moyenne de 2 images

C[i][j] ½ (A[i][j] + B[i][j]) pour tout i, j2. Différence de 2 images

C[i][j] A[i][j] - B[i][j] pour tout i, j.

3. Généralisation de la moyenne de 2 images C[i][j] (1 – f) A[i][j] + f B[i][j] pour tout i, j.

f = 0.0 f = 0.25 f = 0.5 f = 0.75 f = 1.0

Page 20: 1 Représentation et traitement des images en OpenGL

20

4. Combinaison d’une image source S avec une image destination D selonle niveau de transparence de S, où la résultante sera dans D.

Pour tout k = 0, 1, 2 // k désigne resp. les composantes rouge, vert et bleu.

D[i][j][k] ij S[i][j][k] + (1 - ij) D[i][j][k] pour tout i, j

où ij = S[i][j][3] / 255 = niveau de transparence / 255.Exemple :

Les « pixels » du dragon de S ont un facteur de transparence de 255 (opaque), les « pixels » du masque de S ont un facteur de transparence de 128 (semi-transparent),tandis que les autres « pixels » de S sont complètement transparents (facteur detransparence de 0).

S D

Page 21: 1 Représentation et traitement des images en OpenGL

21

En OpenGL, la fonction glBlendFunc permet de jouer ce rôle.

De plus, on peut fixer le facteur de transparence d’un sommet à l’aide de la fonctionglColor4f(r, v, b, alpha) où alpha [0, 1] (1 est la valeur par défaut).