This shows you the differences between two versions of the page.
|
ipg:laboratoare:01 [2025/09/30 12:29] 127.0.0.1 external edit |
ipg:laboratoare:01 [2026/09/30 19:27] (current) andrei.lambru |
||
|---|---|---|---|
| Line 2: | Line 2: | ||
| <note tip> | <note tip> | ||
| - | Bun venit la prima activitate practică a acestei materii! În fiecare săptămână, până la finalul semestrului, vom folosi un framework adaptat special pentru aceste activități practice. Framwork-ul este scris în limbajul C++ și folosește API-ul grafic OpenGL. Primul pas al acestui laborator este să realizați [[ ppbg:setup-framework | setup-ul framework-ului ]]. | + | Bun venit la prima activitate practică a acestei materii! În fiecare săptămână, până la finalul semestrului, vom folosi un framework adaptat special pentru aceste activități practice. Framwork-ul este scris în limbajul C++ și folosește API-ul grafic OpenGL. Primul pas al acestui laborator este să realizați [[ ipg:setup-framework | setup-ul framework-ului ]]. |
| </note> | </note> | ||
| - | ===== Elemene de geometrie ===== | + | ===== Introducere ===== |
| - | ==== Introducere ===== | + | Această activitate este introductivă și nu este dedicată direct programării graficii pe calculator. Aceasta este realizată cu scopul reluării/introducerii unui set din noțiunile de geometrie ce sunt **fundamentale** domeniului programării graficii și în sens mai larg, domeniului dezvoltării de jocuri în general. |
| - | + | ||
| - | Această activitate este introductivă si nu este dedicată direct programării graficii pe calculator. Ea este realizată cu scopul reluării/introducerii unui set din noțiunile de geometrie ce sunt **fundamentale** domeniului programării graficii și în sens mai larg, domeniului dezvoltării de jocuri în general. | + | |
| <note important> | <note important> | ||
| - | O mare parte din noțiunile studiate în cadrul acestei activități **stau la baza** domeniilor menționate mai sus, sau altfel spus, ele reprezintă noțiuni din abecedarul domeniilor, fără de care ințelegerea lor este pur și simplu //imposibilă//. Astfel, vă încurajez cu mare căldură să parcurgeți această activitate cu atenție și să adresați întrebări ori de cate ori considerați necesar. | + | O mare parte din noțiunile studiate în cadrul acestei activități **stau la baza** domeniilor menționate mai sus, sau altfel spus, ele reprezintă noțiuni din //abecedarul// domeniilor, fără de care ințelegerea lor este pur și simplu //imposibilă//. Astfel, vă încurajez cu mare căldură să parcurgeți această activitate cu atenție și să adresați întrebări ori de cate ori considerați necesar. |
| </note> | </note> | ||
| Line 18: | Line 16: | ||
| **Va doresc mult succes în noul semestru :) !** | **Va doresc mult succes în noul semestru :) !** | ||
| </note> | </note> | ||
| + | |||
| + | <hidden> | ||
| + | ===== Elemene de geometrie ===== | ||
| ==== Vectorul ==== | ==== Vectorul ==== | ||
| Line 23: | Line 24: | ||
| //**Vectorul** reprezintă un instrument matematic ce descrie deplasamentul unui punct de la o poziție inițială la o poziție finală.// | //**Vectorul** reprezintă un instrument matematic ce descrie deplasamentul unui punct de la o poziție inițială la o poziție finală.// | ||
| - | Un astfel de exemplu se poate vedea în imaginea de mai jos, unde vectorul $\vec{V_{12}}$ descrie deplasamentul de la poziția la care se află punctul $P_1$ , la poziția la care se află punctul $P_2$ . Se poate observa faptul că simbolul grafic ce descrie un element de tip vector reprezintă numele elementului, acompaniat de o sageată ce este poziționată deasupra lui. | + | Un astfel de exemplu se poate vedea în imaginea de mai jos, unde vectorul $\vec{V_{12}}$ descrie deplasamentul de la poziția la care se află punctul $P_1$ , la poziția la care se află punctul $P_2$ . Se poate observa faptul că simbolul grafic ce descrie un element de tip vector reprezintă numele elementului, acompaniat de o săgeată ce este poziționată deasupra lui. |
| {{ :ipg:laboratoare:vector.png?350 |}} | {{ :ipg:laboratoare:vector.png?350 |}} | ||
| Line 101: | Line 102: | ||
| $$ | $$ | ||
| - | Procesul de compunere a 2 vectori se poate reprezenta grafic prin plasarea celui de-al doilea vector în continuarea primului. Mai exact, se poate plasa coada săgeții celui de-al doilea vector în capătul sageții primului vector. Dupa acest pas, săgeata obținută prin trasarea ei de la coada primului vector la capătul celui de-al doilea este reprezentarea vizuală a vectorului rezultant. Acesta din urmă se află pe direcția bisectoarei unghiului dintre cei doi vectori. Procesul descris se poate observa în imaginea de mai jos. | + | Procesul de compunere a 2 vectori se poate reprezenta grafic prin plasarea celui de-al doilea vector în continuarea primului. Mai exact, se poate plasa coada săgeții celui de-al doilea vector în capătul săgeții primului vector. După acest pas, săgeata obținută prin trasarea ei de la coada primului vector la capătul celui de-al doilea este reprezentarea vizuală a vectorului rezultant. Acesta din urmă se află pe direcția bisectoarei unghiului dintre cei doi vectori. Procesul descris se poate observa în imaginea de mai jos. |
| {{ :ipg:laboratoare:vector-5.png?750 |}} | {{ :ipg:laboratoare:vector-5.png?750 |}} | ||
| <note tip> | <note tip> | ||
| - | Procesul de compunere de vectori are aplicabilitate în geometrie prin faptul că descrie o operație cu care se pot prelucra direcții. Un exemplu de aplicabilitate este compunerea unei direcții de deplasare a unui obiect cu o alta dată de direcția de accelerație a obiectului, ce este diferită de cea de deplasare. Prin procesul de compunere a celor două directii, se obține direcția de deplasare la cadrul curent. | + | Procesul de compunere de vectori are aplicabilitate în geometrie prin faptul că descrie o operație cu care se pot prelucra direcții. Un exemplu de aplicabilitate este compunerea unei direcții de deplasare a unui obiect cu o alta dată de direcția de accelerație a obiectului, ce este diferită de cea de deplasare. Prin procesul de compunere a celor două direcții, se obține direcția de deplasare la cadrul curent. |
| </note> | </note> | ||
| Line 126: | Line 127: | ||
| $$ | $$ | ||
| - | Obținerea vectorului $\vec{V_u}$ poartă denumirea de **normalizare** a vectorului $\vec{V}$ , deoarece se împarte fiecare componentă a lui $\vec{V}$ la norma lui $\vec{V}$ :) . | + | Obținerea vectorului $\vec{V_u}$ poartă denumirea de **normalizare** a vectorului $\vec{V}$ , deoarece se împarte fiecare componentă a lui $\vec{V}$ la norma lui :) . |
| === Produsul scalar a doi vectori === | === Produsul scalar a doi vectori === | ||
| Line 157: | Line 158: | ||
| <hidden> | <hidden> | ||
| === ?Produsul vectorial a doi vectori - Concept 3D === | === ?Produsul vectorial a doi vectori - Concept 3D === | ||
| - | </hidden> | ||
| <note tip> | <note tip> | ||
| Line 183: | Line 183: | ||
| $$ | $$ | ||
| - | unde $P_1$ , $P_2$ si $P_3$ sunt punctele de la colțurile triunghiului, conform imaginii de mai jos: | + | unde $P_1$ , $P_2$ și $P_3$ sunt punctele de la colțurile triunghiului, conform imaginii de mai jos: |
| {{ :ipg:laboratoare:triangle.png?350 |}} | {{ :ipg:laboratoare:triangle.png?350 |}} | ||
| Line 204: | Line 204: | ||
| {{ :ipg:laboratoare:point-triangle.png?350 |}} | {{ :ipg:laboratoare:point-triangle.png?350 |}} | ||
| - | ===== Laborator ===== | + | </hidden> |
| - | ==== Biblioteca glm ==== | + | |
| + | ===== Biblioteca glm ===== | ||
| În framework-ul de laborator, se utilizează biblioteca [[ https://glm.g-truc.net/0.9.9/ | glm ]], ce pune la dispoziție structuri de date pentru puncte și vectori, împreună cu operațiile uzuale de lucru cu aceste elemente. | În framework-ul de laborator, se utilizează biblioteca [[ https://glm.g-truc.net/0.9.9/ | glm ]], ce pune la dispoziție structuri de date pentru puncte și vectori, împreună cu operațiile uzuale de lucru cu aceste elemente. | ||
| Line 265: | Line 266: | ||
| </code> | </code> | ||
| - | ==== Descrierea culorilor ==== | + | ===== Descrierea culorilor ===== |
| Conceptul de culoare este unul complex, care ar putea necesita conținutul unui curs în sine. În domeniul graficii pe calculator, se utilizează modele matematice, denumite //modele de culoare// pentru a prelucra o astfel de informație. În practică, API-urile grafice, precum și API-ul OpenGL, pe care îl utilizăm în cadrul framework-ului, utilizează modelul de culoare RGB, la care ne vom rezuma și noi până la finalul semestrului. | Conceptul de culoare este unul complex, care ar putea necesita conținutul unui curs în sine. În domeniul graficii pe calculator, se utilizează modele matematice, denumite //modele de culoare// pentru a prelucra o astfel de informație. În practică, API-urile grafice, precum și API-ul OpenGL, pe care îl utilizăm în cadrul framework-ului, utilizează modelul de culoare RGB, la care ne vom rezuma și noi până la finalul semestrului. | ||
| Line 283: | Line 284: | ||
| <note tip> | <note tip> | ||
| - | Aprofundarea modelelor de culoare depășește conținutul acestui curs. Pentru a obține mai multe informatii despre acest subiect, puteți consulta următoarele cărți: | + | Aprofundarea modelelor de culoare depășește conținutul acestui curs. Pentru a obține mai multe informații despre acest subiect, puteți consulta următoarele cărți: |
| * Levkowitz, Haim, ed. Color theory and modeling for computer graphics, visualization, and multimedia applications. Boston, MA: Springer US, 1997. | * Levkowitz, Haim, ed. Color theory and modeling for computer graphics, visualization, and multimedia applications. Boston, MA: Springer US, 1997. | ||
| * Fairchild, Mark D. Color appearance models. John Wiley & Sons, 2013. | * Fairchild, Mark D. Color appearance models. John Wiley & Sons, 2013. | ||
| </note> | </note> | ||
| - | ==== Metode utilitare ==== | + | ===== Metode utilitare ===== |
| În cadrul acestui laborator, sunt oferite metode specifice pentru desenarea mai multor tipuri de primitive grafice. Semnăturile acestor metode sunt scrise mai jos. Consultați fișierul ''primitives_rendering_scene.h'' pentru o descriere mai detaliată a fiecărui parametru al metodelor. | În cadrul acestui laborator, sunt oferite metode specifice pentru desenarea mai multor tipuri de primitive grafice. Semnăturile acestor metode sunt scrise mai jos. Consultați fișierul ''primitives_rendering_scene.h'' pentru o descriere mai detaliată a fiecărui parametru al metodelor. | ||
| Line 300: | Line 301: | ||
| </code> | </code> | ||
| - | ==== Cerințe laborator ==== | + | ===== Cerințe laborator ===== |
| <note important> | <note important> | ||
| Line 311: | Line 312: | ||
| - Desenați vectorul $\vec{V_2}$ în continuarea lui $\vec{V_1}$ și vectorul $\vec{V_1}$ în continuarea lui $\vec{V_2}$ , conform procesului de compunere a doi vectori, descris mai sus. \\ Utilizați metoda ''RenderVector(...)'' pentru desenarea unui vector. După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ipg:laboratoare:vectors-task-1.png?600 |}} | - Desenați vectorul $\vec{V_2}$ în continuarea lui $\vec{V_1}$ și vectorul $\vec{V_1}$ în continuarea lui $\vec{V_2}$ , conform procesului de compunere a doi vectori, descris mai sus. \\ Utilizați metoda ''RenderVector(...)'' pentru desenarea unui vector. După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ipg:laboratoare:vectors-task-1.png?600 |}} | ||
| - 0.05p - Completați metoda ''Exercise2()'' pentru desenarea următorilor vectori rezultanți în urma diferenței dintre două puncte: $\{\vec{V_{21}}, \vec{V_{43}}, \vec{V_{56}}, \vec{V_{87}}\}$ . \\ După rezolvarea acestei cerințe, ar trebui să obțineti rezultatul următor: {{ :ipg:laboratoare:vectors-task-2.png?600 |}} | - 0.05p - Completați metoda ''Exercise2()'' pentru desenarea următorilor vectori rezultanți în urma diferenței dintre două puncte: $\{\vec{V_{21}}, \vec{V_{43}}, \vec{V_{56}}, \vec{V_{87}}\}$ . \\ După rezolvarea acestei cerințe, ar trebui să obțineti rezultatul următor: {{ :ipg:laboratoare:vectors-task-2.png?600 |}} | ||
| - | - 0.05p - Completati metoda ''Exercise3()'' astfel: | + | - 0.05p - Completați metoda ''Exercise3()'' astfel: |
| - Desenați vectorii unitate aflați pe direcția celor 5 vectori prezenți în cadrul cerinței. | - Desenați vectorii unitate aflați pe direcția celor 5 vectori prezenți în cadrul cerinței. | ||
| - Nu utilizați etichete pentru desenarea vectorilor unitate. \\ După rezolvare, ar trebui să obțineți rezultatul următor: {{ :ipg:laboratoare:vectors-task-3.png?600 |}} | - Nu utilizați etichete pentru desenarea vectorilor unitate. \\ După rezolvare, ar trebui să obțineți rezultatul următor: {{ :ipg:laboratoare:vectors-task-3.png?600 |}} | ||