Introduction - Université de Sherbrooke

IMN428
Chapitre 1 - Introduction
Olivier Godin
Université de Sherbrooke
22 janvier 2014
Présentation
1 / 40
Pipeline graphique
1
Pipeline graphique
2
Introduction à OpenGL
3
Références
Présentation
2 / 40
Pipeline graphique
Cette section présente une introduction au concept de pipeline
graphique.
Celui-ci est composé des différentes étapes du rendu d’une scène
3D, du positionnement des points dans l’espace à la discrétisation des
objets en pixels pour l’affichage sur un écran d’ordinateur.
Présentation
3 / 40
Pipeline graphique
Une scène 3D typique est composée de plusieurs objets distincts,
chacun composé d’un ensemble de points (xi , yi , zi ) appelés vertex.
On se retrouve alors dans l’une des situation suivantes :
1
On connaît les relations entre les points et on peut construire (et
afficher) l’objet ; ou
2
On ne connaît pas ces relations et elles doivent être estimées
pour pouvoir construire l’objet.
Présentation
4 / 40
Pipeline graphique
Les relations entre les points portent le nom de primitives
graphiques. Elles décrivent comment construire les surfaces d’un
objet à partir d’une liste de points. La librairie OpenGL définit 10
primitives graphiques.
Bien qu’elles puissent toutes être utilisées, la plupart des surfaces
3D seront définies à partir de triangles.
Présentation
5 / 40
Pipeline graphique
!
"#$%&'&()&*+(,-+.&/+(&
!
0
2
1
3
Points
0
1
2
5
4
5
1
2
2
5
1
Line Loop
0
4
0
2
0
Line Strip
Lines
4
3
0
3
0
3
4
5
4
1
2
3
4
3
0
2
1
4
5
Quads
5
1
Triangle Strip
Triangles
0
3
6
3
1
2
Triangle Fan
1
4
6
7
6
2
0
2
6
3
1
3
5
Quad Strip
7
4
Polygon
5
!
!"#$%&' ()()! "#$! %&$'()! *+,-.-/! 0$1+'$2! 3$'! 3/&$2! 41! 5-.&#+62! &-+7+3+8$9! "#$! ':7,$-2!
+'0+6.3$!3#$!4-0$-!+'!;#+6#!3#$!8$-3+6$2!.-$!2&$6+1+$0!14-!$.6#!&-+7+3+8$!3/&$9!
F IGURE: Primitives graphiques permises par OpenGL, tiré de [2]
&*$3$2!'$$02!34!,$!<'4;'9!"#$-$!$=+23!%&$'()!$=3$'2+4'2!3#.3!.**4;!3#$!&-45-.7!
-:''+'5!4'!3#$!>?@!34!0$3$-7+'$!;#$'!.!&.-3+6:*.-!2$3!41!-$'0$-+'5!6477.'02!
#.8$! 1+'+2#$0! $=$6:3+'5! 4'! 3#$! (?@9! A:6#! 2/'6#-4'+B.3+4'! #.2! 3#$! 3$'0$'6/! 34!
Présentation
2*4;!04;'!.!CD!5-.&#+62!.&&*+6.3+4'E!24!+3!+2!:2:.**/!.84+0$0!;#$'$8$-!&422+,*$!
6 / 40
Processeur graphique
Un ordinateur moderne possède un processeur graphique dédié
(GPU) qui exécute des instructions indépendamment du processeur
central (CPU).
Présentation
7 / 40
Processeur graphique
Le CPU envoie des directives de rendu au GPU qui s’occupe
d’effectuer les opérations, tandis que le CPU peut continuer son travail.
Une application communique avec le GPU en envoyant des
instructions à une librairie graphique (comme OpenGL ou DirectX),
qui à son tour envoie des commandes au pilote (driver) qui lui, parle le
langage natif du GPU.
Présentation
8 / 40
Processeur graphque
Une processeur graphique possède aussi sa propre mémoire : la
VRAM, pour video random access memory. Les données qu’on y
retrouve peut être de toute forme, mais il y a aussi certains
incontournables :
les données de l’image : les valeurs de chaque pixel de la
fenêtre d’affichage de la scène 3D ;
les données de profondeur : les profondeurs associées aux
objets pour chacun des pixels de l’image ;
les données de texture : les images utilisées pour augmenter le
réalisme d’une scène.
Présentation
9 / 40
portantly, VRAM contains the front and back image buffers. The front image
buffer contains the exact pixel data that is visible in the viewport. The viewport is
Processeur
graphique
the area
of the display containing the rendered image and may be a subregion of
a window, the entire contents of a window, or the full area of the display. The
CPU
Main Memory
Application
Rendering commands
Vertex data
Texture data
Shader parameters
OpenGL or
DirectX
Graphics
Driver
Command buffer
Video Memory
GPU
Image
Buffers
Depth/stencil
Buffer
Texture
Maps
Vertex
Buffers
Figure 1.2. The communications that take place between the CPU and GPU.
F IGURE: Communication entre le CPU et le GPU
Présentation
10 / 40
Repères de points
Les données géométriques sont transmises au processeur graphique
sous la forme de points 3D. Une des tâches du GPU est de convertir
cette information de manière à la rendre compatible avec une fenêtre
2D sur l’écran de l’ordinateur.
Pour arriver à faire cette transformation, plusieurs repères ou
systèmes de coordonnées sont utilisés.
Présentation
11 / 40
Repères de points
L’ensemble des points appartenant à un même objet est
habituellement exprimé dans l’espace objet. Il s’agit d’un repère qui
est local à l’objet et qui est utilisé seulement par celui-ci. L’espace objet
sert à définir les positions relatives des points entre eux et non pas
dans l’espace.
La position et l’orientation de chaque objet 3D sont quant à eux
exprimés dans l’espace monde, un système de coordonnées global
qui lie tous les espaces objets ensembles.
Présentation
12 / 40
Repères de points
Avant de faire le rendu d’une scène, tous les objets doivent être
amenés dans l’espace caméra, un repère 3D où les axes x et y
correspondent respectivement à la largeur et la hauteur de la fenêtre
d’affichage.
Pour convertir directement des points d’un espace objet à l’espace
caméra, on utilise la matrice modelview.
Présentation
13 / 40
Repères de points
Une fois tous les points convertis dans l’espace caméra, on leur
applique une projection pour les amener dans l’espace homogène
tronqué.
On le dit homogène parce que les objets y respectent alors la logique
voulant que les éléments les plus près apparaissent plus gros que
ceux qui sont éloignés. On dit aussi que l’espace est tronqué,
puisque seules les parties visibles de la scène sont conservées, le
reste étant éliminé de la suite des calculs.
Présentation
14 / 40
Repères de points
Le dernier repère utilisé est l’espace image. On aboutit à celui-ci à
l’aide de la transformation viewport. Dans ce repère, les positions en x
et en y sont ramenés à un intervalle correspondant aux coordonnées
des pixels, tandis que la position en z est ramenée à l’intervalle [0, 1].
La position en z est par la suite stockée dans la carte de profondeur
(sur la VRAM) à des profondeurs entières, en fonction du nombre de
bits par pixel utilisé pour emmagasiner celle-ci.
Présentation
15 / 40
Once a model’s vertices have been transformed into camera space, they undergo a projection transformation that has the effect of applying perspective so
that geometry becomes smaller as the distance from the camera increases. (Pro-
Repères de points
World
Space
Object
Space
Model-view
transformation
Camera
Space
Projection
Homogeneous
Clip Space
Viewport transformation
Window
Space
Figure 1.3. The coordinate spaces appearing in the rendering pipeline. Vertex positions
FareIGURE
: Repères
de points
pipeline
graphique,
tiré deinto
[2]
submitted
to the graphics
library inselon
object le
space
and are eventually
transformed
window space for primitive rasterization.
Présentation
16 / 40
Discrétisation
Une fois obtenus les points dans l’espace image, le GPU doit décider
quels pixels de la fenêtre utiliser pour représenter la scène.
Le processus de remplissage de lignes horizontales de pixels
appartenant à un même objet est appelé rasterization.
Présentation
17 / 40
Introduction à OpenGL
1
Pipeline graphique
2
Introduction à OpenGL
3
Références
Présentation
18 / 40
Qu’est-ce qu’OpenGL
L’objectif du cours d’infographie est d’apprendre... l’infographie : ce
n’est pas un cours d’OpenGL. OpenGL est un outil utilisé dans le
cadre des travaux pour mettre en application la théorie.
La structure d’OpenGL est similaire à celle des autres systèmes
graphiques, tel que DirectX. Ainsi, ce qui est vu dans le cours
d’infographie restera valide lors de l’utilisation d’une autre librairie.
Présentation
19 / 40
Qu’est-ce qu’OpenGL
OpenGL est une librairie graphique (Open Graphics Library)
développée par Silicon Graphics.
Elle est constituée de plusieurs centaines de fonctions
graphiques.
OpenGL est indépendant du matériel, du langage utilisé et du
système d’exploitation.
OpenGL N’EST PAS un langage de programmation.
Présentation
20 / 40
Fonctions graphiques
Une librairie graphique doit non seulement pouvoir afficher de
l’information à l’écran, mais elle doit aussi être en mesure de gérer
les données fournies par l’utilisateur. 2.3 The OpenGL Application Programming
Application
program
Function calls
Data
Graphics
system
Output
Input
Input/Output
devices
FIGURE 2.3 Graphics system as a black box.
F IGURE: Application, librairie graphique et utilisateur
information on OpenGL and on other APIs is given in the Suggested Readings section
at the end of the chapter.
2.3.1 Graphics Functions
Our basic model of a graphics package is a black box, a term that engineers use to
denote a system whose properties are described only by its inputs and outputs; we
may know nothing about its internal workings. We can think of the graphics system
asPrésentation
a box whose inputs are function calls from an application program; measurements
21 / 40
Fonctions graphiques
Les fonctions fournies par OpenGL peuvent être séparées en six
catégories principales :
1
Les fonctions primitives qui permettent de manipuler les entités
géométriques de base. Celles-ci varieront selon la librairie utilisée.
Avec OpenGL, on a seulement accès aux points, aux segments,
et aux polygones.
2
Les fonctions attributs servent à définir l’allure des primitives
graphiques de base : couleur, texture, etc.
3
Les fonction de visualisation sont utiles pour définir les options
associées à la caméra virtuelle : position, orientation, type de
projection, etc.
Présentation
22 / 40
Fonctions graphiques
4
les fonctions de transformation permettent quant à elles de
positionner les points et les objets comme bon nous semble dans
la scène : translation, rotation, homothétie, etc.
5
les fonctions d’interaction font le lien entre les contrôleurs de
l’ordinateur (clavier, souris, trackpad, manette, etc) et le système
graphique.
6
les fonctions de contrôle établissent la relation entre le système
d’exploitation de l’ordinateur et le système graphique, entre autres
pour la gestion des fenêtres.
Présentation
23 / 40
L’interface OpenGL
Toutes les commandes et fonctions de OpenGL ont comme préfixe gl.
OpenGL propose des fonctions de bas niveau (point, segment,
polygones).
Les fonctions de haut niveau proviennent de librairies additionnelles
qui interagissent avec OpenGL : GLUT et GLU.
Présentation
24 / 40
L’interface OpenGL
GLUT (OpenGL utility toolkit) est une librairie permettant
l’interfaçage entre OpenGL et le matériel.
Elle ajoute à OpenGL des fonctions d’affichage et de gestion des
périphériques.
GLUT propose aussi des primitives géométrique de haut niveau :
sphère, cylindre, théière, etc.
Le préfixe des fonctions est glut.
Présentation
25 / 40
L’interface OpenGL
GLU (OpenGL utility library) est une autre librairie ajoutant des
fonctions de haut niveau à OpenGL.
GLU se spécialise dans les transformations géométriques, la
triangulation et le rendu des surfaces.
Le préfixe des fonctions est glu.
Présentation
26 / 40
Fonctions utiles
Une des fonctions de dessin de base dans OpenGL est
glVertex*(.), qui permet de dessiner un point dont les
coordonnées sont passées en paramètre. Il est nécessaire de spécifier
une dimension (2, 3 ou 4) et un type de données (float, int, short,
double, etc.) pour les coordonnées. Par exemple, glVertex2i(.)
dessinera un point 2D avec des coordonnées en int.
Tout dessin est une liste d’appels à la fonction glVertex*(.). La
liste d’appels doit commencer par glBegin(.) et se terminer par
glEnd(). Selon ce que l’on souhaite dessiner, les paramètres de
glBegin(.) varieront.
Présentation
27 / 40
Fonctions utiles
Points : glBegin(GL_POINTS)
Lignes : glBegin(GL_LINES)
Polygones : glBegin(GL_POLYGON)
Triangles : glBegin(GL_TRIANGLES)
Quadrilatères : glBegin(GL_QUADS)
Présentation
28 / 40
Exemple
glBegin(GL_POLYGON);
glVertex3f( 20.0,-4.0, 20.0);
glVertex3f(-20.0,-4.0, 20.0);
glVertex3f(-20.0,-4.0,-20.0);
glVertex3f( 20.0,-4.0,-20.0);
glEnd();
D’autres paramètres sont aussi possibles pour glBegin(.).
Présentation
29 / 40
Fonctions utiles
GL_LINE_STRIP permet de dessiner une suite de segments
rattachés les une aux autres.
GL_LINE_LOOP ajoute un segment à GL_LINE_STRIP afin de
boucler la boucle.
GL_TRIANGLE_STRIP utilisera quatre sommets pour dessiner
deux triangles adjacents.
GL_QUAD_STRIP utilisera six sommets pour dessiner deux
quadrilatères adjacents.
Le nombre d’appels à glVertex*(.) dépendra donc du paramètre
de glBegin(.).
Présentation
30 / 40
Fonctions utiles
!
"#$%&'&()&*+(,-+.&/+(&
!
0
2
1
3
Points
0
1
2
5
4
5
1
2
2
5
1
Line Loop
0
4
0
2
0
Line Strip
Lines
4
3
0
3
0
3
4
5
4
1
2
3
4
3
0
2
1
4
5
Quads
5
1
Triangle Strip
Triangles
0
3
6
3
1
2
Triangle Fan
1
4
6
7
6
2
0
2
6
3
1
3
5
Quad Strip
7
4
Polygon
5
!
!"#$%&' ()()! "#$! %&$'()! *+,-.-/! 0$1+'$2! 3$'! 3/&$2! 41! 5-.&#+62! &-+7+3+8$9! "#$! ':7,$-2!
+'0+6.3$!3#$!4-0$-!+'!;#+6#!3#$!8$-3+6$2!.-$!2&$6+1+$0!14-!$.6#!&-+7+3+8$!3/&$9!
F IGURE: Primitives graphiques permises par OpenGL, tiré de [2]
&*$3$2!'$$02!34!,$!<'4;'9!"#$-$!$=+23!%&$'()!$=3$'2+4'2!3#.3!.**4;!3#$!&-45-.7!
-:''+'5!4'!3#$!>?@!34!0$3$-7+'$!;#$'!.!&.-3+6:*.-!2$3!41!-$'0$-+'5!6477.'02!
#.8$! 1+'+2#$0! $=$6:3+'5! 4'! 3#$! (?@9! A:6#! 2/'6#-4'+B.3+4'! #.2! 3#$! 3$'0$'6/! 34!
Présentation
2*4;!04;'!.!CD!5-.&#+62!.&&*+6.3+4'E!24!+3!+2!:2:.**/!.84+0$0!;#$'$8$-!&422+,*$!
31 / 40
Fonctions utiles
Un polygone peut être dessiné de plusieurs façons :
En mode fil de fer : GL_LINE
Rempli avec la couleur courante : GL_FILL
Il possède deux faces, que l’on manipulera avec GL_FRONT, GL_BACK
et GL_FRONT_AND_BACK.
Présentation
32 / 40
Fonctions utiles
La fonction glColor*(.) prend en paramètre trois valeurs dans
l’intervalle [0, 1] ou [0, 255] (selon le type de données) pour définir la
couleur, et une quatrième (la valeur α, optionnelle) qui sera utilisée
dans la gestion de la transparence.
glColor3f( 1.0, 1.0, 1.0 ); // Blanc
glColor3f( 1.0, 0.0, 0.0 ); // Rouge
glColor3f( 0.0, 1.0, 0.0 ); // Vert
Présentation
33 / 40
Fonctions utiles
Projection orthogonale : glOrtho(.)
Transformation en perspective : glFrustum(.) et
gluPerspective(.)
Sélection de la matrice active : glMatrixMode(.)
Initialisation de la matrice active : glLoadIdentity()
Modification de la matrice active : glLoadMatrix*(.) et
glMultMatrix*(.)
Gestion de la pile de matrices : glPushMatrix() et
glPopMatrix()
Présentation
34 / 40
Fonctions utiles
Rotation : glRotate*(.)
Translation : glTranslate*(.)
Changement d’échelle : glScale*(.)
Position et orientation de la caméra : gluLookAt(.)
Gestion de l’illumination : glLight*(.) et glLightModel*(.)
Propriétés des surfaces : glMaterial*(.) et
glColorMaterial(.)
Présentation
35 / 40
Fonctions utiles
Sphère : glutSolidSphere(.) / glutWireSphere(.)
Cube : glutSolidCube(.) / glutWireCube(.)
Cône : glutSolidCone(.) / glutWireCone(.)
Tore : glutSolidTorus(.) / glutWireTorus(.)
Théière : glutSolidTeapot(.) / glutWireTeapot(.)
Présentation
36 / 40
Programme type OpenGL
Un programme est généralement composé de cinq parties :
1
Une fonction d’initialisation : void initialiser(.)
2
Une fonction d’affichage : void afficher(.)
3
Une fonction de fenêtrage : void refenetrer(.)
4
Une fonction de gestion du clavier : void clavier(.)
5
Une fonction de gestion de la souris : void souris(.)
6
Une fonction principale : int main(.)
Présentation
37 / 40
Programme type OpenGL
Dans la fonction main(.) du travail pratique #2, on retrouve
glutMouseFunc( MouseButton );
glutMotionFunc( MouseMove );
glutReshapeFunc( Reshape );
glutDisplayFunc( Display );
glutKeyboardFunc( keyboard );
Présentation
/*
/*
/*
/*
/*
Souris */
Souris */
Fenêtrage */
Affichage */
Clavier */
38 / 40
Références
1
Pipeline graphique
2
Introduction à OpenGL
3
Références
Présentation
39 / 40
Références
E. Angel and D. Shreiner.
Interactive Computer Graphics : a Top-Down Approach with Shader-Based OpenGL.
Addison-Wesley, 6th edition, 2012.
E. Lengyel.
Mathematics for 3D Game Programming and Computer Graphics.
Course Technology PTR, 3rd edition, 2012.
Présentation
40 / 40