Differences
This shows you the differences between two versions of the page.
|
ppbg:laboratoare:08 [2023/12/07 11:17] andrei.lambru |
— (current) | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== Laboratorul 08 ====== | ||
| - | <note tip> | ||
| - | **Reamintire!!!** Puteți prezenta rezolvările cerințelor de până la 2 laboratoare, în fiecare săptămână. De exemplu, puteți prezenta laboratorul curent și pe cel din săptămâna anterioară, în totalitate sau parțial, inclusiv punctajul pentru cerința bonus :) . | ||
| - | </note> | ||
| - | |||
| - | <note tip> | ||
| - | Pentru rezolvarea cerințelor din cadrul acestui labroator: | ||
| - | - [[https://github.com/UPB-Graphics/gfx-framework-ppbg | Descărcați]] framwork-ul de laborator și copiați, din arhiva descărcată, directorul **Lab8**, în interiorul directorului //gfx-framework-ppbg\src\lab// din versiunea voastră de proiect. | ||
| - | - Adăugați în fișierul ''lab_list.h'', linia ''#include "lab/lab8/lab8.h"''. | ||
| - | - Folosiți din nou utilitarul CMake pentru a regenera proiectul. Pentru a vă reaminti procesul de realizare a setup-ului, puteți să reconsultați [[:ppbg:setup-framework | pagina]] dedicată acestui lucru. | ||
| - | </note> | ||
| - | |||
| - | ===== Programe de tip shader pentru prelucrarea geometriei ===== | ||
| - | |||
| - | În acest laborator, se introduce un nou tip de program de tip shader ce are rolul de a prelucra geometria modelelor 3D, precum triunghiurile dintr-o rețea de triunghiuri prin care este definit un astfel de model. Acest tip de program de tip shader este cunoscut în limba engleză sub numele de **geometry shader** și are scopul de a oferi control asupra geometriei desenate. În banda grafică, el apare după pasul de asamblare a triunghiurilor, pe baza indicilor specificati în [[ https://ocw.cs.pub.ro/courses/ppbg/laboratoare/04#index_buffer_object_ibo | IBO]]. O privire de ansamblu a benzii grafice, ce cuprinde și programele de tip geometry shader, poate fi vizualizată în imaginea de mai jos. | ||
| - | |||
| - | {{ :ppbg:laboratoare:geometry-shader.png?600 |}} | ||
| - | |||
| - | Pentru fiecare triunghi rezultat în urma procesului de asamblare pe baza indicilor din IBO, se apelează **o singură instanță** de program de tip geometry shader. | ||
| - | |||
| - | ====== Sintaxa limbajului GLSL ====== | ||
| - | Un exemplu de vertex shader: | ||
| - | <code glsl> | ||
| - | #version 330 | ||
| - | |||
| - | layout(location = 0) in vec3 v_position; | ||
| - | layout(location = 1) in vec2 v_texcoord; | ||
| - | |||
| - | uniform mat4 Model; | ||
| - | uniform mat4 View; | ||
| - | uniform mat4 Projection; | ||
| - | |||
| - | // coordonatele de textura ale varfului | ||
| - | // atributele de iesire ale unui program de tip vertex shader | ||
| - | // sunt atribute de intrare pentru un program de tip geometry shader | ||
| - | out vec2 vert_texcoord; | ||
| - | |||
| - | void main() | ||
| - | { | ||
| - | gl_Position = Projection * View * Model * vec4(v_position, 1.0); | ||
| - | | ||
| - | vert_texcoord = v_texcoord; | ||
| - | } | ||
| - | </code> | ||
| - | |||
| - | Un exemplu de geometry shader: | ||
| - | <code glsl> | ||
| - | #version 330 | ||
| - | |||
| - | // geometria primita la intrare este formata dintr-un triunghi | ||
| - | layout(triangles) in; | ||
| - | |||
| - | // geometria transmisa la iesire | ||
| - | layout(triangle_strip, max_vertices = 3) out; | ||
| - | |||
| - | // atribut de intrare - coordonatele de textura ale varfurilor unui triunghi | ||
| - | in vec2 vert_texcoord[3]; | ||
| - | |||
| - | // atribut de iesire - coordonatele textura asociate fiecarui varf emis | ||
| - | out vec2 geom_texcoord; | ||
| - | |||
| - | void main() | ||
| - | { | ||
| - | gl_Position = gl_in[0].gl_Position; | ||
| - | geom_texcoord = vert_texcoord[0]; | ||
| - | EmitVertex(); | ||
| - | |||
| - | gl_Position = gl_in[1].gl_Position; | ||
| - | geom_texcoord = vert_texcoord[1]; | ||
| - | EmitVertex(); | ||
| - | |||
| - | gl_Position = gl_in[2].gl_Position; | ||
| - | geom_texcoord = vert_texcoord[2]; | ||
| - | EmitVertex(); | ||
| - | |||
| - | EndPrimitive(); | ||
| - | //directiva aceasta incheie primitiva | ||
| - | } | ||
| - | </code> | ||
| - | |||
| - | ==== Atribute de intrare și de iesire ==== | ||
| - | |||
| - | * Trebuie specificat tipul geometriei de la intrare: <code glsl> | ||
| - | layout(triangles) in; | ||
| - | </code> Trebuie să fie unul dintre: ''points'', ''lines'', ''lines_adjacency'', ''triangles'', ''triangles_adjacency''. Aceste tipuri de date sunt descrise într-o secțiune următoare. | ||
| - | |||
| - | * Trebuie specificat tipul geometriei de la ieșire: <code glsl> | ||
| - | layout(triangle_strip, max_vertices = 3) out; | ||
| - | </code> Trebuie să fie unul dintre: ''points'', ''line_strip'', ''triangle_strip''. Aceste tipuri de date sunt descrise într-o secțiune următoare. | ||
| - | |||
| - | * Se primesc coordonatele de textură de la toată primitiva (triunghiul). Astfel că intrarea este un vector de 3 valori ''vec2''. <code glsl> | ||
| - | in vec2 vert_texcoord[3]; | ||
| - | </code> | ||
| - | * Nu este necesar să se dea dimensiunea vectorului. Astfel, codul de mai sus se poate scrie: <code glsl> | ||
| - | in vec2 vert_texcoord[]; | ||
| - | </code> | ||
| - | |||
| - | * De asemenea, există și un atribut implicit într-un program de tip geometry shader, cu numele ''gl_in'', din care ne interesează ''gl_Position'': <code glsl> | ||
| - | in gl_PerVertex | ||
| - | { | ||
| - | vec4 gl_Position; | ||
| - | ... | ||
| - | } gl_in[]; | ||
| - | </code> | ||
| - | |||
| - | * Atributele de ieșire ale unui program de tip geometry shader sunt descrise în secțiunea următoare: <code glsl> | ||
| - | out vec2 geom_texcoord; | ||
| - | </code> | ||
| - | |||
| - | ==== Emiterea de primitive ==== | ||
| - | |||
| - | Pentru fiecare vârf emis dintr-un program de tip geometry shader, se poate asocia informație despre coordonata de textură, vectorul normal, culoarea și orice alt tip de informație asociată vârfului (specificate înainte de fiecare apel ''EmitVertex()''). | ||
| - | Acestea trebuie declarate ca variabile de ieșire. | ||
| - | După cum se poate observa, valoarea lui ''geom_texcoord'' este actualizată înainte de fiecare apel ''EmitVertex()'':<code glsl> | ||
| - | gl_Position = gl_in[0].gl_Position; | ||
| - | geom_texcoord = vert_texcoord[0]; | ||
| - | EmitVertex(); | ||
| - | </code> | ||
| - | |||
| - | Într-un geometry shader, se pot emite mai multe primitive (comanda ''EmitVertex()'' se poate da o dată sau de mai multe ori). | ||
| - | |||
| - | ==== Tipuri de primitive ==== | ||
| - | |||
| - | La ieșirea unui program de tip geometry shader, se permit doar 3 tipuri de date, cum a fost menționat mai sus: ''points'', ''line_strip'' și ''triangle_strip''. Descrierea topologiei pentru fiecare tip de date este după cum urmează: | ||
| - | * ''points'': se deseneaza un singur pixel, la poziția din poarta de afișare în care se regăsește fiecare vârf emis de un program de tip geometry shader. Un astfel de exemplu este reprezentat vizual în imaginea de mai jos. | ||
| - | * ''line_strip'': se desenează linii între fiecare pereche consecutivă de vârfuri emise de un program de tip geometry shader. După cum se poate urmări în panoul din mijloc al imaginii de mai jos, pentru o listă de 6 vârfuri emise în ordinea { v0, v1, v2, v3, v4, v5 }, se creează o linie între vârfurile { v0, v1 }, { v1, v2 }, { v2, v3 }, { v3, v4 } și { v4, v5 }. | ||
| - | * ''triangle_strip'': se desenează triunghiuri pentru toate tripletele consecutive de vârfuri emise de un program de tip geometry shader. După cum se poate urmări în panoul din dreapta al imaginii de mai jos, pentru o listă de 7 varfuri emise în ordinea { v0, v1, v2, v3, v4, v5, v6 }, se creează un triunghi cu vârfurile { v0, v1, v2 }, { v1, v2, v3 }, { v2, v3, v4 }, { v3, v4, v5 } și { v4, v5, v6 }. | ||
| - | |||
| - | {{ :ppbg:laboratoare:triangles.png?600 |}} | ||
| - | |||
| - | La intrarea unui program de tip geometry shader se permit 5 tipuri de date, cum a fost mentionat mai sus: ''points'', ''lines'', ''lines_adjacency'', ''triangles'', ''triangles_adjacency''. Pentru toate tipurile de date se primeste de fapt **o singura instanta** din acel tip la executia unei instante de program de tip geometry shader. Diferenta principala intre aceste tipuri este data de numarul de atribute de intrare primite in ''gl_in'' si in cele proprii programelor de tip shader. Mai exact: | ||
| - | * ''points'': se primeste exact //un singur// element in atributele de intrare. | ||
| - | * ''lines'': se primesc //doua// elemente in atributele de intrare. | ||
| - | * ''lines_ajacency'': se primesc //4// elemente in atributele de intrare. | ||
| - | * ''triangles'': se primesc //3// elemente in atributele de intrare. | ||
| - | * ''triangles_adjacency'': se primesc //6// elemente in atributele de intrare. | ||
| - | |||
| - | ===== Prelucrari la nivel de triunghi ===== | ||
| - | |||
| - | Printre prelucrarile frecvente asupra unui triunghi, se numara calcularea unui centru si a vectorului perpendicular pe planul triunghiului. | ||
| - | |||
| - | Se poate calcula centroidul unui triunghi cu urmatoarea abordare: | ||
| - | <code glsl> | ||
| - | vec3 p1 = gl_in[0].gl_Position.xyz; | ||
| - | vec3 p2 = gl_in[1].gl_Position.xyz; | ||
| - | vec3 p3 = gl_in[2].gl_Position.xyz; | ||
| - | |||
| - | vec3 center = (p1 + p2 + p3) / 3; | ||
| - | </code> | ||
| - | |||
| - | Se poate calcula vectorul perpendicular pe planul triunghiului cu abordarea: | ||
| - | <code glsl> | ||
| - | vec3 p1 = gl_in[0].gl_Position.xyz; | ||
| - | vec3 p2 = gl_in[1].gl_Position.xyz; | ||
| - | vec3 p3 = gl_in[2].gl_Position.xyz; | ||
| - | |||
| - | vec3 v12 = normalize(p2 - p1); | ||
| - | vec3 v13 = normalize(p3 - p1); | ||
| - | |||
| - | // produs vectorial | ||
| - | vec3 normal = cross(v12, v13); | ||
| - | </code> | ||
| - | |||
| - | ===== Cerinte laborator ====== | ||
| - | |||
| - | - 0.05p - Completati fisierele ''LabShader.GS.glsl'' si ''Texture.FS.glsl'' pentru a desena geometria arcasei pe baza texturii. Dupa acest pas, rezultatul vizual ar trebui sa fie urmatorul: {{ :ppbg:laboratoare:geometry-shader1.png?600 |}} | ||
| - | - 0.05p - Modificati programul de tip geometru shader din fisierul ''LabShader.GS.glsl'' pentru a desena obiectul pentru care se utilizeaza de cel putin 5 ori, la pozitii diferite in scena. Poate fi aliniat pe aceeasi linie. | ||
| - | - 0.1p - Completati fisierele ''Triangle.GS.glsl'' si ''Color.FS.glsl'' pentru a obtine urmatorul rezultat vizual: {{ :ppbg:laboratoare:geometry-shader2.png?600 |}} | ||
| - | * Utilizati programul de tip shader pentru desenarea triunghiului din centru. | ||
| - | * Pentru a obtine rezultatul vizual din imagine, la iesire trebuie transmise mai multe triunghiuri :) . | ||
| - | - 0.05p - Creati un alt program de tip geometry shader cu care sa realizati o animatie de "explozie" a geometriei similara cu cea din imaginea urmatoare: {{ :ppbg:laboratoare:geometry-shader.gif?600 |}} | ||
| - | * Aveti in vedere ca animatia de "explozie" se reseteaza dupa un interval de timp. Hint: utilizati timpul aplicatiei si informatia vectorilor normali. | ||
| - | - 0.05p - Creati un alt program de tip geometry shader cu care sa desenati marcaje liniare ce specifica directia normalei in fiecare varf al retelei de triunghiuri ce formeaza geometria: {{ :ppbg:laboratoare:geometry-shader3.png?600 |}} | ||
| - | * Desenati de doua ori geometria. Odata triunghiurile peste care se aplica textura. O a doua oara in care se utilizeaza programul de tip geometry shader doar pentru desenarea liniilor ce reprezinta vectorii normali. | ||
| - | * Specificati tipul de geometrie de iesire la ''line_strip''. | ||
| - | * Trebuie desenata o linie pentru fiecare varf, cu care se specifica directia vectorului normal din informatia varfului. | ||
| - | * Rezultatul vizual ar trebui sa fie similar cu cel din imaginea de mai jos: | ||
| - | |||
| - | Bonus: Creati un alt program de tip geometry shader cu care sa realizati un efect de explozie in care geometria este afectata de gravitatie, similar cu cea din imaginea de mai jos: | ||
| - | {{ :ppbg:laboratoare:geometry-shader1.gif?600 |}} | ||
| - | |||
| - | Utilizati ecuatia miscarii: | ||
| - | |||
| - | |||
| - | $$ | ||
| - | P = P_0 + V \cdot t + \frac{1}{2} \cdot a \cdot t^2 | ||
| - | $$ | ||
| - | |||
| - | unde V este o directie de miscare specifica fiecarui triunghi :), iar a este vec3(0, -1, 0). Puteti utiliza si alte valori pentru acceleratia gravitatilonala. t este timpul animatiei. Aveti in vedere ca triunghiurile nu coboara sub valoare 0 pentru componenta y. Animatia se reseteaza dupa un anumit timp. | ||
