Differences
This shows you the differences between two versions of the page.
|
ppbg:laboratoare:01 [2024/09/24 18:16] andrei.lambru |
ppbg:laboratoare:01 [2024/10/10 18:31] (current) andrei.lambru [Cerințe laborator] |
||
|---|---|---|---|
| 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 [[ ppbg:setup-framework | setup-ul framework-ului ]]. |
| </note> | </note> | ||
| Line 65: | Line 65: | ||
| <note tip> | <note tip> | ||
| - | În situația în care doriți să obțineți vectorul de deplasare de la punctul $P_1$ la punctul $P_2$ , în direcția spre $P_2$ , se calculeaza vectorul de diferență $\vec{V_{12}}=P_2-P_1$ . Cu alte cuvinte, punctul spre care doriți să obțineți vectorul rezultant este cel din care scădeți punctul de la care pleacă vectorul. | + | În situația în care doriți să obțineți vectorul de deplasare de la punctul $P_1$ la punctul $P_2$ , în direcția spre $P_2$ , se calculează vectorul de diferență $\vec{V_{12}}=P_2-P_1$ . Cu alte cuvinte, punctul spre care doriți să obțineți vectorul rezultant este cel din care scădeți punctul de la care pleacă vectorul. |
| </note> | </note> | ||
| Line 90: | Line 90: | ||
| $$ | $$ | ||
| - | Procesul de compunere a 2 vectori se poate reprezenta grafic prin plasarea celui de-al doilea vector in 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 obtinuta 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 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. |
| {{ :ppbg:laboratoare:vector-5.png?750 |}} | {{ :ppbg:laboratoare:vector-5.png?750 |}} | ||
| Line 102: | Line 102: | ||
| //Un **vector unitate** este un vector ce are lungimea 1.// | //Un **vector unitate** este un vector ce are lungimea 1.// | ||
| - | Un astfel de vector are aplicabilități în programarea jocurilor video pentru realizarea animațiilor continue și în grafica pe calculator pentru simularea efectului de iluminare. Majoritatea situațiilor de utilizare necesită obținerea unui vector unitate $\vec{V_u}$ , ce are aceeași direcție cu un alt vector $\vec{V}$ dat. Pentru a obține acest vector $\vec{V_u}$ , se poate folosi formula de mai jos. | + | Un astfel de vector are aplicabilități în programarea jocurilor video pentru realizarea animațiilor continue și în grafica pe calculator pentru simularea efectului de iluminare. Majoritatea situațiilor de utilizare necesită obținerea unui vector unitate $\vec{V_u}$ , ce are aceeași direcție cu un alt vector $\vec{V}$ dat. Pentru a obține acest vector $\vec{V_u}$ , se poate folosi formula de mai jos: |
| $$ | $$ | ||
| Line 207: | Line 207: | ||
| <code cpp> | <code cpp> | ||
| - | float x = position.x; | + | float x = v.x; |
| - | float y = position.y; | + | float y = v.y; |
| </code> | </code> | ||
| Line 234: | Line 234: | ||
| glm::vec2 v = glm::vec2(4.0f, 3.0f); | glm::vec2 v = glm::vec2(4.0f, 3.0f); | ||
| - | float magnitude = glm::length(v); | + | float norm = glm::length(v); |
| </code> | </code> | ||
| Line 256: | Line 256: | ||
| ==== Descrierea culorilor ==== | ==== Descrierea culorilor ==== | ||
| - | TBA | + | 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. |
| + | |||
| + | Modelul de culoare RGB descrie culorile prin descompunerea lor în 3 culori primare, respectiv: roșu, verde și albastru. Acronimul "RGB" provine de la numele lor în limba engleză: "**R**ed", "**G**reen" și "**B**lue". | ||
| + | |||
| + | În cadrul laboratorului, se poate utiliza o structură de tip ''glm::vec3'', ce conține 3 componente, analog structurii ''glm::vec2'', la care se mai adaugă componenta ''z''. Se utilizează această structură de date doar pentru a stoca un triplet de valori ce este interpretat sub formă de culoare în modelul RGB. API-ul grafic OpenGL interpretează valoarea fiecărei componente a tripletului între limitele 0 și 1. Mai jos sunt descrise cateva culori de baza formate din valorile tripletelor. | ||
| + | |||
| + | <code cpp> | ||
| + | glm::vec3 red_color = glm::vec3(1, 0, 0); | ||
| + | glm::vec3 green_color = glm::vec3(0, 1, 0); | ||
| + | glm::vec3 blue_color = glm::vec3(0, 0, 1); | ||
| + | |||
| + | glm::vec3 yellow_color = glm::vec3(1, 1, 0); | ||
| + | glm::vec3 cyan_color = glm::vec3(0, 1, 1); | ||
| + | </code> | ||
| + | |||
| + | <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: | ||
| + | * 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. | ||
| + | </note> | ||
| ==== Metode utilitare ==== | ==== Metode utilitare ==== | ||
| Line 277: | Line 296: | ||
| Completați fisierul ''lab01.cpp'' cu următoarele: | Completați fisierul ''lab01.cpp'' cu următoarele: | ||
| - | - 0.05p - Completati metoda ''Exercise1()'' astfel: | + | - 0.05p - Completați metoda ''Exercise1()'' astfel: |
| - | - Desenati vectorui rezultant in urma compunerii vectorilor $\vec{V_1}$ si $\vec{V_2}$ . | + | - Desenați vectorui rezultant în urma compunerii vectorilor $\vec{V_1}$ și $\vec{V_2}$ . |
| - | - Desenati vectorul $\vec{V_2}$ in continuarea lui $\vec{V_1}$ si vectorul $\vec{V_1}$ in continuarea lui $\vec{V_2}$ , conform procesului de compunere a doi vectori, descris mai sus. \\ Utilizati metoda ''RenderVector(...)'' pentru desenarea unui vector. Dupa rezolvarea acestei cerinte, ar trebui sa obtineti rezultatul urmator: {{ :ppbg: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: {{ :ppbg:laboratoare:vectors-task-1.png?600 |}} |
| - | - 0.05p - Completati metoda ''Exercise2()'' pentru desenarea urmatorilor vectori rezultanti in urma diferentei dintre doua puncte: $\{\vec{V_{21}}, \vec{V_{43}}, \vec{V_{56}}, \vec{V_{87}}\}$ . \\ Dupa rezolvarea acestei cerinte, ar trebui sa obtineti rezultatul urmator: {{ :ppbg: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: {{ :ppbg:laboratoare:vectors-task-2.png?600 |}} |
| - 0.05p - Completati metoda ''Exercise3()'' astfel: | - 0.05p - Completati metoda ''Exercise3()'' astfel: | ||
| - | - Desenati vectorii unitate aflati pe directia celor 5 vectori prezenti in cadrul cerintei. | + | - Desenați vectorii unitate aflați pe direcția celor 5 vectori prezenți în cadrul cerinței. |
| - | - Nu utilizati etichete pentru desenarea vectorilor unitate. \\ Dupa rezolvare, ar trebui sa obtineti rezultatul urmator: {{ :ppbg: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: {{ :ppbg:laboratoare:vectors-task-3.png?600 |}} |
| - | - 0.05p - Completati metoda ''Exercise4()'' pentru desenarea arcului de cerc dintre cei doi vectori. \\ Utilizati metoda ''RenderArc(...)'' pentru desenarea arcului de cerc, impreuna cu produsul scalar si ''acos(radians)'' pentru calcularea unghiului dintre cei 2 vectori. Dupa rezolvarea acestei cerinte, ar trebui sa obtineti rezultatul urmator: {{ :ppbg:laboratoare:vectors-task-4.png?600 |}} | + | - 0.05p - Completați metoda ''Exercise4()'' pentru desenarea arcului de cerc dintre cei doi vectori. \\ Utilizați metoda ''RenderArc(...)'' pentru desenarea arcului de cerc, împreună cu produsul scalar și ''acos(radians)'' pentru calcularea unghiului dintre cei 2 vectori. După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ppbg:laboratoare:vectors-task-4.png?600 |}} |
| - | - 0.05p - Completati metoda ''Exercise5()'' pentru desenarea valorii ariei fiecaruia dintre cele 3 triunghiuri. Textul trebuie afisat la pozitia centrului de greutate al fiecarui triunghi. \\ Utilizati formula lui Heron pentru calcularea ariei. Folositi metoda ''RenderText(...)'' pentru desenarea valorii ariei. Dupa rezolvarea acestei cerinte, ar trebui sa obtineti rezultatul urmator: {{ :ppbg:laboratoare:vectors-task-5.png?600 |}} | + | - 0.05p - Completați metoda ''Exercise5()'' pentru desenarea valorii ariei fiecăruia dintre cele 3 triunghiuri. Textul trebuie afișat la poziția centrului de greutate al fiecărui triunghi. \\ Utilizați formula lui Heron pentru calcularea ariei. Folosiți metoda ''RenderText(...)'' pentru desenarea valorii ariei. După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ppbg:laboratoare:vectors-task-5.png?600 |}} |
| - | - 0.05p - Completati metoda ''Exercise6()'' pentru desenarea punctelor din lista dupa urmatoarea regula: | + | - 0.05p - Completați metoda ''Exercise6()'' pentru desenarea punctelor din listă după următoarea regulă: |
| - | - Punctele ce se afla in interiorul triunghiului se deseneaza in culoarea verde; | + | - Punctele ce se află în interiorul triunghiului se desenează în culoarea verde; |
| - | - Punctele ce se afla in afara triunghiului se deseneaza in culoarea rosie. \\ Deoarece ariile sunt calculate cu tipuri de date în virgulă mobilă, nu se poate folosi direct comparația de egalitate și trebuie să ne asumăm un anumit nivel de eroare în calcule. Astfel, în cod, comparația va fi în felul următor: <code cpp> | + | - Punctele ce se află în afara triunghiului se desenează în culoarea roșie. \\ Deoarece ariile sunt calculate cu tipuri de date în virgulă mobilă, nu se poate folosi direct comparația de egalitate și trebuie să ne asumăm un anumit nivel de eroare în calcule. Astfel, în cod, comparația va fi în felul următor: <code cpp> |
| const float EPSILON = 0.01f; | const float EPSILON = 0.01f; | ||
| bool inside_triangle = abs(area_v1v2v3 - (area_pv1v3 + area_pv1v2 + area_pv2v3)) < EPSILON; | bool inside_triangle = abs(area_v1v2v3 - (area_pv1v3 + area_pv1v2 + area_pv2v3)) < EPSILON; | ||
| - | </code> \\ Dupa rezolvarea acestei cerinte, ar trebui sa obtineti rezultatul urmator: {{ :ppbg:laboratoare:vectors-task-6.png?600 |}} | + | </code> \\ După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ppbg:laboratoare:vectors-task-6.png?600 |}} |
| - | <hidden> | ||
| Bonus: | Bonus: | ||
| - | - In cadrul exercitiului 4, desenati cu o culoare diferita arcul de cerc pentru unghiul mare dintre cei doi vectori. | + | În cadrul exercițiului 4, desenați cu o culoare diferită arcul de cerc pentru unghiul mare dintre cei doi vectori. După rezolvarea acestei cerințe, ar trebui să obțineți rezultatul următor: {{ :ppbg:laboratoare:vectors-task-bonus.png?600 |}} |
| - | </hidden> | + | |
