Chapitre 5 : Rendu projectif en OpenGL Vertex et Fragment ... - FIL

Chapitre 5 : Rendu projectif en OpenGLVertex et Fragment shadersModélisation 3D et SynthèseFabrice Aubertfabrice.aubert@lifl.frIEEA - Master Info - Parcours IVI2012-2013F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 1 / 58

Tracer les données des array buffers (OpenGL 2.1)◮ OpenGL 2.1 ? Pourquoi ?void Square : : drawBuffer ( ) {/ / a c t i v e r l ’ a l i m e n t a t i o n de l ’ a t t r i b u t gl_Vertex pour chaque sommet t r a c ég l E n a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;}/ / l e b u f f e r courant des données :g l B i n d B u f f e r (GL_ARRAY_BUFFER, b u f f e r V e r t e x ) ;/ / l e s a t t r i b u t s gl_Vertex seront l u s depuis l e b u f f e r b u f f e r V e r t e x ( i . e . l e b u f f e r courant ) :g l V e r t e x P o i n t e r ( 3 ,GL_FLOAT, 0 , 0 ) ;/ / commande de t r a c é ( exé c u t i o n du p i p e l i n e de t r a c é ) avec 4 sommets :glDrawArrays (GL_TRIANGLE_STRIP , 0 , 4 ) ;g l D i s a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 6 / 58

Gestion mémoire◮ Toujours se rappeler qu’OpenGL "travaille" avec les valeurs courants des états(glBindBuffer(...) indique par exemple le buffer courant actif).◮ Ne pas oublier de gérer correctement la mémoire si besoin (cf tous les glDelete(...),par exemple glDeleteBuffers).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 7 / 58

Pipeline de tracé⇒ tout sommet provoque l’exécution d’un programme appelé Vertex Shader.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 8 / 58

Vertex Shader◮ Chaque sommet subit le vertex shader.◮ = programme exécuté (par la carte graphique si possible).◮ = programme écrit dans un langage particulier : GLSL (OpenGL Shading Language).◮ OpenGL permet de compiler/linker et activer des programmes GLSL# version 110void main ( ) {g l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗gl_ModelViewMatrix∗gl_Vertex ;}◮ ⇒ langage inspiré de C/C++◮ Tous les états sont accessibles par des "variables" identifiées par gl_.• gl_Vertex : de type vec4 correspond aux coordonnées (x,y,z,w) (fourni par lesdonnées lues dans le ARRAY_BUFFER).• gl_ModelViewMatrix : de type mat4 correspond à la valeur de la MODELVIEW.• gl_Projection : de type mat4 correspond à la valeur de la matrice PROJECTION.◮ Le vertex shader doit fournir obligatoirement gl_Position à la suite du pipeline.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 9 / 58

GLSL◮ Tout le langage GLSL est résumé sur les 4 dernières pages dehttp://www.khronos.org/files/opengl-quick-reference-card.pdfF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 10 / 58

Rasterization⇒ tout pixel qui est tracé provoque l’exécution d’un programme appelé Fragment Shader.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 11 / 58

Fragment shader◮ Même langage que vertex shader : GLSL◮ Doit fournir une couleur pour le pixel qui est en train d’être tracé (affecter gl_FragColorde type vec4).Exemple de base (listing du fichier essai.frag) :# version 110void main ( ) {/ / a f f e c t a t i o n avec du v e r t ( i . e . vec4 i n t e r p r é t é comme ( rouge , vert , bleu , alpha ) ) .gl_FragColor=vec4 ( 0 . 0 , 1 . 0 , 0 . 0 , 0 . 0 ) ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 12 / 58

Compilation et activation d’un shader◮ Compilation/link par l’application OpenGL :void create ( ) {programId=glCreateProgram ( ) ;v e r t e x I d =glCreateShader (GL_VERTEX_SHADER ) ;fragmentId=glCreateShader (GL_FRAGMENT_SHADER) ;glAttachShader ( programId , v e r t e x I d ) ;glAttachShader ( programId , fragmentId ) ;char ∗source= r e a d F i l e ( " essai . v e r t " ) ;glShaderSource ( v ertexId ,1 ,& source , NULL ) ;char ∗source= r e a d F i l e ( " essai . f r a g " ) ;glShaderSource ( fragmentId ,1 ,& source , NULL ) ;glCompileShader ( v e r t e x I d ) ;glCompileShader ( fragmentId ) ;glLinkProgram ( programId ) ;}◮ Utilisation (activation pour tous les tracés effectués par draw() par exemple) :void drawScene ( ) {. . .glUseProgram ( programId ) ;draw ( ) ;. . .}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 13 / 58

ResultatF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 14 / 58

Interpolation de variables : varying◮ Le vertex shader peut calculer des valeurs qui seront fournies à la suite du pipeline(variables en sortie).◮ Le fragment shader peut récupérer ces variables dont les valeurs ont subi une interpolationbilinéaire par rapport aux valeurs de chacun des sommets (variables en entrée).◮ Ces variables, qui apparaissent avec le même nom dans le vertex et le fragment, sontqualifiées de varying.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 15 / 58

Exemple : interpolation des couleursVertex Shader :# version 110varying vec4 couleur ;void main ( ) {couleur=gl_Color ; / / gl_Color est aliment é par l e b u f f e r d ’ a t t r i b u t GL_COLOR_ARRAYg l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗gl_ModelViewMatrix∗gl_Vertex ;}Fragment Shader :# version 110varying vec4 couleur ;void main ( ) {gl_FragColor=couleur ;}Tracé OpenGL :g l E n a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, b u f f e r V e r t e x ) ;g l V e r t e x P o i n t e r ( 3 ,GL_FLOAT, 0 , 0 ) ;g l E n a b l e C l i e n t S t a t e (GL_COLOR_ARRAY ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, b u f f e r C o l o r ) ;g l C o l o r P o i n t e r ( 3 ,GL_FLOAT, 0 , 0 ) ;glDrawArrays (GL_TRIANGLE, 0 , 3 ) ;F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 16 / 58

Tracé de faces avec indicesf l o a t cube[]={−1,−1,−1, / / Vertex 0−1,1,−1, / / Vertex 11,−1,−1, / / Vertex 21 ,1 , −1 , / / Vertex 3−1,−1,1, / / Vertex 4−1 ,1 ,1 , / / Vertex 51 , −1 ,1 , / / Vertex 61 ,1 ,1 , / / Vertex 7} ;unsigned i n t i n d i c e [ ] = { 0 , 1 , 2 , 3 , 6 , 7 , 4 , 5 , 0 , 1 ,5 ,7 ,1 ,3 , / / " couvercle dessus "6 , 4 , 2 , 0 } ; / / " couvercle dessous "F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 17 / 58

Exemple du cube : initialisation buffersGLuint vertexCube , indiceCube ;void i n i t B u f f e r C u b e ( ) {f l o a t cube[]={−1 ,−1 ,−1 ,−1 ,1 ,−1 ,1 ,−1 ,−1 ,1 ,1 ,−1 ,−1 ,−1 ,1 ,−1 ,1 ,1 ,1 ,−1 ,1 ,1 ,1 ,1};}unsigned i n t i n d i c e [ ] = { 0 , 1 , 2 , 3 , 6 , 7 , 4 , 5 , 0 , 1 ,5 ,7 ,1 ,3 ,6 , 4 , 2 , 0 } ;glGenBuffers (1 ,& vertexCube ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, vertexCube ) ;g l B u f f e r D a t a (GL_ARRAY_BUFFER,24∗ s i z e o f ( GLfloat ) , cube ,GL_STATIC_DRAW ) ;glGenBuffers (1 ,& indiceCube ) ;g l B i n d B u f f e r (GL_ELEMENT_ARRAY_BUFFER, indiceCube ) ;g l B u f f e r D a t a (GL_ELEMENT_ARRAY_BUFFER,18∗ s i z e o f ( GLuint ) , indice ,GL_STATIC_DRAW ) ;F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 18 / 58

Exemple du cube : tracég l E n a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, vertexCube ) ;g l V e r t e x P o i n t e r ( 3 ,GL_FLOAT, 0 , 0 ) ;g l B i n d B u f f e r (GL_ELEMENT_ARRAY_BUFFER, indiceCube ) ;/ / s t y l e de p r i m i t i v e s , nombre de sommets , type des indices , début de l e c t u r e dans l e s i n d i c e s ( en u n i t machine )glDrawElements (GL_TRIANGLE_STRIP,10 ,GL_UNSIGNED_INT , ( void ∗)( s i z e o f ( GLuint )∗0));glDrawElements (GL_TRIANGLE_STRIP, 4 ,GL_UNSIGNED_INT , ( void ∗)( s i z e o f ( GLuint )∗10));glDrawElements (GL_TRIANGLE_STRIP, 4 ,GL_UNSIGNED_INT , ( void ∗)( s i z e o f ( GLuint )∗14));g l D i s a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 19 / 58

GL TRIANGLESPour le cube, le GL_TRIANGLE_STRIP n’est pas nécessairement bien adapté.◮ On peut également spécifier tous les triangles dans le tableau d’indices.◮ Puis tracer avec un seulglDrawElements(GL_TRIANGLES,??,GL_UNSIGNED_INT,(void *)0).Exercice : combien de triangles à tracer ? quel est alors le tableau d’indices (indiquez le débutpour les 3 premiers triangles) ?F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 20 / 58

2 EclairementF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 21 / 58

Réalisme◮ Pour ajouter du réalisme aux scènes 3D, OpenGL propose de calculer des couleurs poursimuler un éclairement de la scène par des sources lumineuses.⇒ calcul de la couleur provenant de 2 contributions : réflexion diffuse (couleur mat) et réflexionspéculaire (couleur brillante : tâche spéculaire).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 22 / 58

DonnéesLes données nécessaires au calcul d’éclairement sont :◮ Les sources (position, caractéristiques d’éclairement).◮ Le matériel des objets (caractéristiques qui traduisent comment est réfléchie la lumière dessources).◮ On peut avoir jusqu’à 8 sources simultanées en OpenGL. Elles sont identifiées par lesconstantes GL_LIGHT0, GL_LIGHT1, ..., GL_LIGHT7.◮ L’instruction qui permet de donner les caractéristiques des sources : glLight.◮ Il existe deux seuls matériels (un pour les faces FRONT et un pour les BACK). Il faut doncchanger les caractéristiques dès qu’on veut tracer un objet avec un matériel différent del’objet précédemment tracé.◮ L’instruction qui permet de donner les caractéristiques des matériels : glMaterial.◮ Les composantes (rouge, vert, bleu) qui apparaissent dans la suite sont comprises entre 0et 1.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 23 / 58

Modèle d’éclairement◮ Dans ce chapitre, pour illustrer l’éclairement on choisit le modèle empirique de Phong.◮ Très simple, mais aussi très éloigné de la réalité.◮ Le vecteur V est appelé vecteur d’observation, le vecteur L est appelé vecteurd’éclairement.◮ La position de la source 0 est donnée parglLightfv(GL_LIGHT0,GL_POSITION,) où pos=(x,y,z,w).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 24 / 58

Réflexion diffuse 1/2◮ On suppose qu’un objet (un matériel) diffuse la lumière reçue de manière uniforme danstoutes les directions.◮ La lumière (i.e. la couleur) perçue ne dépend donc pas de la position de l’observateur.◮ L’intensité diffusée dépend des caractéristiques du matériel (matériel rouge =« beaucoup »de rouge diffusé, matériel noir = aucune intensité diffusée, etc).◮ ⇒ Définition d’un coefficient de matériel k d = (rouge,vert,bleu) pour définir cettecaractéristique (toujours ∈ [0,1]).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 25 / 58

Réflexion diffuse 2/2◮ L’intensité diffusée dépend de l’angle d’incidence des rayons lumineux sur la surface del’objet• un éclairement direct (i.e. la lumière arrive orthogonalement à la surface) donne unediffusion maximale.• un éclairement fuyant (i.e tangent à la surface) donne un éclairement nul.• on souhaite que la diffusion varie « continuement »entre ces 2 positions de la manièrela plus réaliste possible.• ⇒ prise en compte de la normale (i.e. vecteur orthogonal) à la surface au point P.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 26 / 58

Calcul du diffus◮ On suppose N et L sont normés (‖N‖ = ‖L‖ = 1).◮ Le calcul de l’intensité du diffus par cos(N,L) = L · N est un « bon »choix.◮ On donnera une couleur de réflexion diffuse K d pour indiquer la couleur réfléchie par lematériel.⇒ Couleur diffus (P) = K d (N · L)◮ seul le « coté »dirigé par la normale est éclairé (si N · L < 0 alors éclairement nul).◮ ⇒ important de spécifier correctement les normales.◮ Composante Kd=(rouge,vert,bleu) couleur souhaitée pour le matériel.◮glMaterialfv (GL_FRONT_AND_BACK, GL_DIFFUSE,);F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 27 / 58

Calcul aux sommets◮ En OpenGL, on se contente souvent de calculer l’éclairement diffus uniquement auxsommets.◮ ⇒ obtention d’une couleur en chaque sommet.◮ La couleur des pixels lors de la rasterization est alors simplement obtenue par interpolationlinéaire des couleurs.◮ Le résultat est satisfaisant par rapport à un calcul sur chacun des points du triangle 3D(bien que ce calcul d’éclairement diffus ne soit pas linéaire sur l’espace écran ! ⇒approximation convenable).⇒ l’interpolation linéaire des couleurs, dans le cadre de l’éclairement est appelée interpolationde Gouraud.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 28 / 58

Normales 1/3◮ Pour le calcul d’éclairement il faut spécifier les normales.◮ Si le calcul s’effectue en chaque sommet, il faut fournir à chaque sommet une normale.g l E n a b l e C l i e n t S t a t e (GL_VERTEX_ARRAY ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, v e r t e x B u f f e r ) ;g l V e r t e x P o i n t e r ( 3 ,GL_FLOAT, 0 , 0 ) ;g l E n a b l e C l i e n t S t a t e (GL_NORMAL_ARRAY) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, normalBuffer ) ; / / a t t r i b u é auparavantglNormalPointer (GL_FLOAT, 0 , 0 ) ;glDrawArrays (GL_TRIANGLES , . . . ) ;◮ Fournir le vecteur orthogonal au polygone tracé ? ⇒ pas nécessairement ! (liberté totale dedonner la normale qu’on souhaite).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 29 / 58

Normales 2/3◮ Pouvoir spécifier une normale différente en chaque sommet permet d’obtenir le calculd’éclairement qui correspond au mieux à la forme souhaitée.◮ ⇒ permet d’obtenir une perception d’un objet lisse en « jouant »uniquement avec lesnormales !F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 30 / 58

Normales 3/3◮ Résultat pour le diffus :F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 31 / 58

Exemple de spécification des normales pour un objetcomplexe◮ La normale de l’objet à représenter peut ne pas être connue (surface « réelle »inconnue).◮ ⇒ Prendre la moyenne des normales aux facettes incidentes au sommet peut donner unebonne approximation de la surface lisse.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 32 / 58

Effets « spéciaux »avec des normales◮ sur l’animation on ne voit pas tous les polygones (grille plus finement subdivisée).◮ il s’agit du principe appliqué par la technique dite du « Bump mapping » : spécifier lesnormales d’un relief sans toucher à la géométrie de l’objet. Seul le calcul d’éclairementdonne la perception de relief.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 33 / 58

Eclairement dans les shaders◮ Tous les vecteurs apparaissant dans les calculs doivent être exprimés dans le mêmerepère : les calculs d’éclairement se feront dans le repère Eye.◮ Transformation des sommets : vertexEye=gl_ModelViewMatrix*gl_Vertex;◮ Transformation des normales : nEye=gl_NormalMatrix*gl_Normal;. Attention :gl_NormalMatrix est une matrice 3x3 et gl_Normal est un vec3.◮ Pourquoi ? A cause des éventuels scales :avant transformationaprès transformation par MODELVIEW◮ La matrice correcte pour transformer les normales est (M −1 ) t où M est la sous-matrice3x3 (3 premières lignes, 3 premières colonnes) de MODELVIEW.(cf http://www.lighthouse3d.com/opengl/glsl/index.php?normalmatrix).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 34 / 58

ShaderVertex shader :# version 110varying vec4 couleur ;void main ( ) {f l o a t i n t e n s i t e D i f f u s ;vec3 N, L ;N=gl_NormalMatrix∗gl_Normal ;/ / Source supposée d i r e c t i o n n e l l e i c i :L=gl_LightSource [ 0 ] . p o s i t i o n . xyz ; / / dé j à exprimé dans l e repè re EyeL=normalize ( L ) ;N=normalize (N ) ;i n t e n s i t e D i f f u s =max( dot (N, L ) , 0 . 0 ) ;couleur= i n t e n s i t e D i f f u s∗g l _ F r o n t M a t e r i a l . d i f f u s e ;g l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗gl_ModelViewMatrix∗gl_Vertex ;}Fragment shader :# version 110varying vec4 couleur ;void main ( ) {gl_FragColor=couleur ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 35 / 58

Remarques sur GLSLOn dispose en GLSL des types propres à la 3D (vec, mat), et d’une manipulation assez soupledes variables :void main ( ) {vec4 a=vec4 ( 0 . 1 , 0 . 2 , 0 . 3 , 0 . 4 ) ; / / c o n s t r u c t e u rf l o a t b=a . x ; / / accès au champ xvec2 c=a . xy ; / / opé r a t i o n d i t e de s i z z l i n gf l o a t d=a .w;mat2 e = mat2 ( 1 . 0 , 0 . 0 , 1 . 0 , 0 . 0 ) ;f l o a t f =e [ 1 ] [ 1 ] ; / / accès tableauvec2 g=e [ 1 ] ; / / 2ieme colonne .. . .}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 36 / 58

Spéculaire◮ La spécularité traduit l’aspect « brillant »de l’objet.◮ La réflexion spéculaire provient de la réflexion (au sens « miroir ») des rayons lumineux surl’objet.◮ ⇒ on considère alors la direction miroir R du vecteur d’éclairement L (R est le symétriquede L par rapport à N).◮ L’intensité de la réflexion spéculaire est maximale dans la direction R et est atténuée autourde cette direction R.⇒ L’intensité perçue (i.e. la couleur) par l’observateur va donc dépendre de sa position parrapport à la direction R.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 37 / 58

Calcul spéculaire◮ Le calcul de V.R (cosinus de l’angle entre V et R) donne une approximation correcte del’effet spéculaire (maximal dans la direction si R dirigé directement sur l’observateur ;atténué autour).◮ Comme pour le diffus : on affecte une caractéristique K s = (rouge,vert,bleu) pour lematériel.◮ Ne pas oublier : tous les vecteurs normés (V.R = cos(V,R) ∈ [0,1]).⇒ Couleur Spéculaire (P) = K s (V · R)F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 38 / 58

Résultat◮ Le calcul du spéculaire donne une « tache »lumineuse sur l’objet (conséquence de laréflexion des rayons lumineux).◮ Pour accentuer ou atténuer l’effet, on donne également un coefficient de brillance s pouraccentuer ou atténuer l’effet autour de la direction principale.◮ ⇒ Couleur Spéculaire (P) = K s (V · R) sF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 39 / 58

Spécifier le spéculaire en OpenGLCe sont les même instructions que pour l’ambiant et le diffus :◮glMaterialfv (GL_FRONT_AND_BACK, GL_SPECULAR, );◮ Brillance : glMateriali (GL_FRONT_AND_BACK,GL_SHININESS,);On peut récupérer ces données dans les shaders avec les built-ingl_FrontMaterial.specular (de type vec4) et gl_FrontMaterial.shininess (de typefloat).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 40 / 58

Spéculaire calculé au sommet◮ Spéculaire : très mal rendu s’il est calculé uniquement au sommet.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 41 / 58

Interpolation de Phong◮ On calcule l’éclairement spéculaire en chacun des pixels (surcout en temps de calcul).◮ Avec quels vecteurs ? on prend les vecteurs L,V,N interpolés linéairement par rapport auxvaleurs aux sommets (variables L,V,N définies comme varying).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 42 / 58

3 Variables uniformF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 43 / 58

Communiquer des valeurs aux shaders◮ Communiquer des valeurs spécifiques à chaque sommet ⇒ attributs de sommets(glVertexPointer, glColorPointer par exemple)◮ Communiquer des valeurs calculées dans le vertex et transmises par interpolation auxfragments ⇒ variables qualifiées de varying◮ Communiquer des valeurs pour paramétrer les shaders (vertex ou fragment) ⇒ variablesqualifiées de uniform• Une variable uniforme peut changer entre chaque tracé (glDraw...) par l’applicationOpenGL, mais leur valeur reste constante durant l’exécution des vertex/fragmentshaders (lecture seule).Exemple : modifier les coordonnées des sommets pour effectuer une dilatation.⇒ déplacer le sommet dans la direction de la normale selon un certain facteurF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 44 / 58

Vertex shader# version 110uniform f l o a t f a c t e u r ;varying vec4 c o u l e u r D i f f u s ;varying vec3 N, L , V ;void main ( ) {f l o a t i n t e n s i t e ;vec4 vertexLocal ;vec4 vertexEye ;/ / déplacement du sommetvertexLocal= f a c t e u r∗vec4 ( gl_Normal , 0 ) + gl_Vertex ;/ / t r a n s f o r m a t i o n & l i g h t i n gvertexEye=gl_ModelViewMatrix∗vertexLocal ;V=vec3(−gl_ModelViewMatrix∗gl_Vertex ) ;L=gl_LightSource [ 0 ] . p o s i t i o n . xyz−vertexEye . xyz / vertexEye .w;N=gl_NormalMatrix∗gl_Normal ;L=normalize ( L ) ;V=normalize (V ) ;N=normalize (N ) ;i n t e n s i t e =dot (N, L ) ;c o u l e u r D i f f u s = g l _ F r o n t M a t e r i a l . d i f f u s e∗i n t e n s i t e ;g l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗vertexEye ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 45 / 58

Affecter les variables uniformDans l’application OpenGL on affecte les variables uniform des shaders avec glUniform :GLuint programId ;GLuint l o c a t i o n F a c t e u r ;void i n i t ( ) {programId=readMyShader ( " d i l a t a t i o n " ) ; / / f o n c t i o n u t i l i t a i r e pour l i r e / compiler / l i n k e r/ / l e s shaders des f i c h i e r s d i l a t a t i o n . v e r t et d i l a t a t i o n . f r a g par exemplel o c a t i o n F a c t e u r =glGetUniformLocation ( programId , " f a c t e u r " ) ; / / r écupé r e r où se trouve " f a c t e u r " dans l e shader}void draw ( ) {glUseProgram ( programId ) ;glUniform1f ( l o c a t i o n F a c t e u r , 0 . 1 ) ; / / a f f e c t e l a v a r i a b l e f a c t e u r du shader avec l a valeur 0.1obj . drawBuffer ( ) ; / / commande de t r a c églUseProgram ( 0 ) ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 46 / 58

4 TextureF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 47 / 58

Définition (intuitive)◮ Une texture est une « image », c’est à dire une grille de pixels.◮ Les pixels de la texture sont appelés texels (pour les différencier des pixels de l’écrangraphique).◮ Chaque texel est localisé dans la texture par ses coordonnées s et t.◮ Toute l’image de la texture est décrite par s ∈ [0,1] et t ∈ [0,1]F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 48 / 58

Plaquer une texture◮ Consiste à associer à chaque point 3D des coordonnées de texture pour lui associer untexel de l’image texture◮ Plaquage linéaire sur un triangle :• Il suffit d’associer des coordonnées de texture uniquement aux sommets.• Les coordonnées de texture des pixels sont alors interpolées linéairement lors duremplissage du triangle.F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 49 / 58

Chargement d’une image de texture◮ On doit attribuer une zone mémoire OpenGL pour accueillir l’image (mémoire qualifiée detexture buffer).GLuint t e x _ i d ;void i n i t T e x t u r e ( ) {/ / géné r a t i o n d ’ un i d e n t i f i a n tglGenTextures (1 ,& t e x _ i d ) ;/ / l a t e x t u r e courante sera l ’ u n i t é 0 à l a q u e l l e on a f f e c t e l a t e x t u r e t e x _ i dg l A c t i v e T e x t u r e (GL_TEXTURE0 ) ;glBindTexture (GL_TEXTURE_2D, t e x _ i d ) ; / / t outes l e s i n s t r u c t i o n s qui s u i v r o n t s ’ adresseront à t e x _ i d/ / a f f e c t a t i o n de l ’ image de l a t e x t u r eglTexImage2D (GL_TEXTURE_2D, / / t e x t u r e 2D (= image )0 , / / niveau de mipmap ( sera vu plus t a r d )3 , / / l e tableau est à i n t e r p r é t e r par " paquet " de/ / t r o i s valeurs consé c u t i v e swidth , height , / / t a i l l e en p i x e l s de l ’ image0 , / / gestion des bords pour recollement/ / ( dans ce cours = 0)GL_RGB, / / i n t e r p r é t a t i o n par OpenGL ( image sera/ / stock ée en valeurs de Rouge , Vert , Bleu )GL_UNSIGNED_BYTE, / / format du tableau ( i c i unsigned byte )image ) ; / / l ’ image ( tableau contenant l e s t e x e l s ) .F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 50 / 58

Attribution des coordonnées de texture◮ On peut plaquer plusieurs textures simultanément lors d’un même tracé : gestion desunités de texture.◮ Pour chaque unité de texture, on peut spécifier :• Une texture distincte (i.e. un identifiant distinct)• Des coordonnées de textures indépendantes et distinctes (i.e. plusieurs coordonnéesde texture pour chaque sommet).GL_TEXTURE0 GL_TEXTURE1 GL_TEXTURE2 placage des 3 unitésF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 51 / 58

Attribution des coordonnées de textureAffectation de la mémoire OpenGL avec des coordonnées de textures :void i n i t B u f f e r ( ) {f l o a t v e r t e x []={ −1 , −1 ,0 , −1 ,1 ,0 ,1 , −1 ,0 ,1 ,1 ,0};f l o a t t e x t u r e [ ] = { 0 , 0 , 0 , 1 , 1 , 0 , 1 , 1 } ;glGenBuffers (1 ,& b u f f e r V e r t e x ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, b u f f e r V e r t e x ) ;g l B u f f e r D a t a (GL_ARRAY_BUFFER,12∗ s i z e o f ( GLfloat ) , vertex ,GL_STATIC_DRAW ) ;glGenBuffers (1 ,& bufferTexCoord0 ) ;g l B i n d B u f f e r (GL_ARRAY_BUFFER, bufferTexCoord0 ) ;g l B u f f e r D a t a (GL_ARRAY_BUFFER,8∗ s i z e o f ( GLfloat ) , t e x t u r e ,GL_STATIC_DRAW ) ;}Pour que le tracé soit fait avec les coordonnées de textures comme attributs de sommet :. . .g l C l i e n t A c t i v e T e x t u r e (GL_TEXTURE0 ) ; / / on t r a v a i l l e avec l e premier jeu de coordonnées de t e x t u r e ( i . e . GL_TEXTURE0)g l E n a b l e C l i e n t S t a t e (GL_TEXTURE_COORD_ARRAY) ; / / a c t i v a t i o n de l ’ a l i m e n t a t i o n du premier jeu de coordonnees de t e x t u r e/ / ( i . e . a l i m e n t a t i o n de gl_MultiTexCoord0 dans l e v e r t e x shader ) .g l B i n d B u f f e r (GL_ARRAY_BUFFER, bufferTexCoord0 ) ;glTexCoordPointer ( 2 ,GL_FLOAT, 0 , 0 ) ; / / données du premier jeu de coordonnées de t e x t u r eglDrawArrays (GL_TRIANGLE_STRIP , 0 , 4 ) ;g l C l i e n t A c t i v e T e x t u r e (GL_TEXTURE0 ) ;g l D i s a b l e C l i e n t S t a t e (GL_TEXTURE_COORD_ARRAY ) ; / / dé s a c t i v e l e premier jeu de coordonnées de t e x t u r e sA noter : possibilité d’avoir plusieurs jeux de coordonnées de textures gérées indépendamment(glClientActiveTexture(GL_TEXTUREi)).F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 52 / 58

Type sampler2D◮ Dans les shaders, les images de texture sont accessibles gràce à des uniform de typesampler2DVertex Shader (se contente d’interpoler les coordonnées de texture) :varying vec2 coordTex ;void main ( ) {coordTex=gl_MultiTexCoord0 . s t ; / / accès premier jeu de coordonneesg l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗gl_ModelViewMatrix∗gl_Vertex ;}Fragment shader (récupération des coordonnées de texture interpolées et lecture de la couleurdans l’image) :uniform sampler2D uneTexture ;varying vec2 coordTex ;void main ( ) {vec4 couleur ;couleur=texture2D ( uneTexture , coordTex ) ;gl_FragColor = couleur ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 53 / 58

Affectation de la texture depuis l’application◮ On affecte l’uniform uneTexture avec l’unité de texture souhaitée.glUseProgram ( monShader . i d ( ) ) ;GLuint locationSampler=glGetUniformLocation ( monShader . i d ( ) , " uneTexture " ) ; / / r écupé r e r où se trouve " uneTexture " dans l e shaderg l U n i f o r m 1 i ( locationSampler , 1 ) ; / / uneTexture correspondra à l ’ image de l ’ u n i t é de t e x t u r e 1draw ( ) ;glUseProgram ( 0 ) ;F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 54 / 58

Un exemple en multi-textureF. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 55 / 58

Dans l’applicationQuelques classes utilitaires pour alléger le code :class GLView : . . . {. . .Shader _earthShader ;Texture _earthDay , _earthNight ;Sphere _sphere ;. . .} ;void GLView : : i n i t ( ) {earthDay . read ( " earthD . jpg " ) ;e a r t h N i g h t . read ( " earthN . jpg " ) ;g l A c t i v e T e x t u r e (GL_TEXTURE0 ) ;earthDay . bind ( ) ;g l A c t i v e T e x t u r e (GL_TEXTURE1 ) ;e a r t h N i g h t . bind ( ) ;sphere . i n i t B u f f e r ( ) ; / / géné r a t i o n sommets+coordonnées de t e x t u r e s}void draw ( ) {earthShader . enable ( ) ;earthShader . uniform ( " texJour " , 0 ) ;earthShader . uniform ( " t e x N u i t " , 1 ) ;sphere . drawBuffer ( ) ;earthShader . d i s a b l e ( ) ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 56 / 58

Le vertex shaderVertex :varying vec2 texCoord ;varying vec3 normal ;varying vec3 L ;void main ( ) {texCoord=gl_MultiTexCoord0 . s t ;/ / Source supposée d i r e c t i o n n e l l e i c i :L=gl_LightSource [ 0 ] . p o s i t i o n . xyz ; / / dé j à exprimé dans l e repè re Eyenormal=gl_NormalMatrix∗gl_Normal ;g l _ P o s i t i o n = g l _ P r o j e c t i o n M a t r i x∗gl_ModelViewMatrix∗gl_Vertex ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 57 / 58

Le fragment shaderFragment :uniform sampler2D texJour , t e x N u i t ;varying vec2 texCoord ;varying vec3 normal ;varying vec3 L ;void main ( ) {vec4 couleurNuit , couleurJour ;vec3 normal2 , L2 ;normal2=normalize ( normal ) ;L2=normalize ( L ) ;f l o a t e c l a i r e =dot ( L2 , normal2 ) ;/ / e c l a i r e=−1 : completement n u i t/ / e c l a i r e =1 : completement j o u re c l a i r e =( e c l a i r e + 1 . 0 ) / 2 . 0 ; / / i n t e r v a l l e [ 0 , 1 ]c o u l e u r N u i t =texture2D ( texNuit , texCoord ) ;couleurJour=texture2D ( texJour , texCoord ) ;/ / mélange t e x t u r e j o u r + n u i t (mélange t r o p étendu i c i )gl_FragColor = couleurJour∗(1− e c l a i r e )+ c o u l e u r N u i t∗e c l a i r e ;}F. Aubert (MS2) M3DS/ Chapitre 5 : Shaders GLSL 2012-2013 58 / 58