2b:null 2c:["$","title",null,{"children":"3. házi feladat – Bézier-felület | Attila Bagossy | Observable"}] 31:T4bf,md`A felület pontjait az előzőleg definiált ${tex`S(s, t)`} függvényt alkalmazva fogjuk számolni. Mind az ${tex`s`}, mind a ${tex`t`} paramétert a ${tex`[0, 1]`} tartományon kell végigfuttatni. Azonban ${tex`s`} minden egyes értéke esetén a ${tex`t`} paramétert újra végig kell vinni az egész ${tex`[0, 1]`} tartományon. Tehát minden rögzített ${tex`s`} érték esetén ${tex`t`} végigfut a teljes ${tex`[0, 1]`} tartományon. Ez praktikusan egy duplaciklus segítségével implementálható. Ezzel még csak meghatároztunk néhány, a felületen fekvő pontot; ezekből még azonban háromszögeket kell képezni. Jelölje ${tex`\Delta`} mind ${tex`s`}, mind ${tex`t`} irányában a növekményt, mellyel a ciklusokat léptetjük. Vegyünk egy rögzített ${tex`s`} és ${tex`t`} értéket. Ekkor egy-egy háromszöget a következő ${tex`s`} és ${tex`t`} értékek által meghatározott felületpontok fognak alkotni: ${tex.block` (s, t), (s, t + \Delta), (s + \Delta, t + \Delta) `} és ${tex.block` (s, t), (s + \Delta, t + \Delta), (s + \Delta, t) `} Figyeljünk arra, hogy a háromszögek csúcsai konzisztensen, az óramutató járásával ellentétesen legyenek felsorolva!`32:T4ac,md`A demonstráció egy bikubikus Bézier-felületet jelenít meg. Ha rákattintunk a kék téglalapra, akkor az megkapja a fókuszt, és el tudja kapni a billentyűeseményeket. A kamera mozgatását a következő billentyűkkel vezérelhetjük: * W - a kamera mozgatása fölfele a henger palástján, * S - a kamera mozgatása lefele a henger palástján, * D - a kamera mozgatása jobbra a henger palástján, * A - a kamera mozgatása balra a henger palástján, * Numpad+ - a henger sugarának növelése (ha nincs kijelölt kontrollpont), * Numpad- - a henger sugarának csökkentése (ha nincs kijelölt kontrollpont). Kattintással tudunk kontrollpontot kijelölni. Az éppen kijelölt kontrollpont zöld színnel lesz kirajzolva. Ha üres területre kattintunk, akkor eltűnik a kijelölés. Amennyiben van kiválasztott kontrollpont, akkor az X, Y és Z billentyűkkel tudjuk kijelölni a tengelyt, amelynek mentén mozgatni szeretnénk a pontot, és a Numpad+, Numpad- billentyűk használatával tudjuk a kontrollpontot a kijelölt tengely mentén elmozgatni.`33:[] 2f:{"id":"4e2197d2d88845a8","slug":"3-hazi-feladat-bezier-felulet","title":"3. házi feladat – Bézier-felület","thumbnail":"9a64b23c3218074b7cb3992dcaae724b008084d13d37e510af45134c2dee713a","access_level":"public","create_time":"$D2020-04-08T05:46:52.334Z","update_time":"$D2020-04-08T06:06:48.673Z","view_time":null,"first_public_time":"$D2020-04-08T05:54:34.668Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"ef739838e5a1d607","login":"battila7","name":"Attila Bagossy","avatar_url":"https://avatars-next.observableusercontent.com/90b1460199ec3e040db6a772368bce18487f1a014e7f564bfbc73d51132a4e07","tier":"starter_2024"},"version":100,"publish_version":100,"role":null,"authored":false,"authors":[{"type":"individual","id":"6afecd2e2d5dcc78","login":"battila7","name":"Attila Bagossy","avatar_url":"https://avatars-next.observableusercontent.com/90b1460199ec3e040db6a772368bce18487f1a014e7f564bfbc73d51132a4e07","tier":null}],"members":[{"type":"individual","id":"6afecd2e2d5dcc78","login":"battila7","name":"Attila Bagossy","avatar_url":"https://avatars-next.observableusercontent.com/90b1460199ec3e040db6a772368bce18487f1a014e7f564bfbc73d51132a4e07","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"f1dad1a4b38291b9","slug":"komputergrafika-19-20-2-hazi-feladatok","title":"Komputergrafika 19/20/2 – Házi feladatok","owner":{"id":"ef739838e5a1d607","login":"battila7","name":"Attila Bagossy"}},"type":"notebook","body":{"title":"3. házi feladat – Bézier-felület","cells":[{"id":0,"value":"md`# 3. házi feladat – Bézier-felület`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"md`## Információk`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"md`\n * Utolsó effektív commit: **2020. április 21. 12:00**\n * A GitHub az utolsó commitból, mely a fenti határidőt megelőzően készült, létrehoz egy submissiont. A védésen a submission tartalma lesz figyelembe véve.\n * Twitch: [twitch.tv/battila7](https://www.twitch.tv/battila7)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"md`## Áttekintés`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"md`A feladat egy **bikubikus Bézier-felület** kirajzolására képes program elkészítése, mely a felület megjelenítése mellett a kontrollpontok áthelyezését biztosítja. A felület pontjait a gyakorlaton megismert képlet segítségével kell kiszámolni.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"md`## Elvárt jellemzők`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"md`### Általános elvárások`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"md`A házi feladat megvédése *csak* akkor lehet sikeres, ha a program a jellemzőit tekintve hiánytalan. Az elvárt jellemzőket teljesítő program\n\n* megjeleníti a kontrollpontokat,\n* megjeleníti a kontrollhálót,\n* a már elhelyezett kontrollpontok mozgatását lehetővé teszi,\n* által kirajzolt felület valós időben követi a kontrollpontok mozgását,\n* a felület pontjainak kiszámításához a gyakorlaton megismert képletet használja,\n* lehetőséget biztosít a felület körbejárására egy hengeren mozgó kamera segítségével,\n* a felületet láthatóság szerint helyesen rajzolja ki,\n* a felületet alkotó háromszögeket felváltva különböző színnel rajzolja ki,\n* a megfelelő transzformációkat alkalmazza.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"md`### A kontrollpontok elhelyezése`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"md`A kontrollhálót alkotó ${tex`16`} pontot nem a felhasználónak kell elhelyeznie, hanem a program elindításakor megjelenik a szükséges számú kontrollpont és velük együtt a felület is. A kontrollpontok kezdeti elhelyezkedése tetszőleges.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"md`### A kontrollpontok mozgatása`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"md`A már elhelyezett kontrollpontok koordinátáinak módosítása tetszőleges módszerrel megvalósítható. A kattintás helyén található kontrollpont azonosítása a legegyszerűbben úgy történhet, hogy a kontrollpontok mindegyikét beszorozzuk a transzformációs mátrixszal, és az így kapott pontokat már kétdimenzióban hasonlítjuk a kattintás helyéhez. \n\nEgymást fedő pontok esetén lehet csak nemdeterminisztikus az így kapott pont kiválasztása. Ezt úgy előzhetjük meg, hogy még háromdimenzióban a festő algoritmus alkalmazásával rendezzük a pontokat.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"md`### Transzformációk és láthatóság`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"md`A megjelenítéshez a *Bevezetés a számítógépi grafikába* tárgy keretein belül megismert technikákat kell alkalmazni. Szükséges \n\n* *Window to Viewport* transzformáció,\n* hengeren mozgó kamera,\n* centrális vetítés,\n* festő algoritmus\n\nhasználata. Fontos, hogy az úgynevezett hátsó lapokat *nem* kell eldobni!\n\nA kamera, a láthatóság és a transzformációs lánc megvalósítását a következő kiírásban szereplő módon tegyük:\n\n

\n https://arato.inf.unideb.hu/kunkli.roland/hf6.pdf\n

\n\nA kontrollhálót és a kontrollpontokat *nem* szükséges láthatóság szerint helyesen megjeleníteni.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"md`### Színek`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"md`A felület elülső és hátulsó lapjait különböző színekkel jelenítsük meg. Ezen felül ahhoz, hogy a felület jól kivehető legyen, a háromszögeket felváltva, különböző színnel rajzoljuk ki. Tehát összesen négy különböző színt kell használnunk, kettőt az elülső, kettőt a hátulsó lapokhoz.\n\nTörekedjünk harmonizáló színkombinációk használatára. Kiindulásként válogathatunk a következő linken találhatóak közül:\n\n

\n https://color.adobe.com/explore/?filter=most-popular&time=all\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"md`## A felületpontok számításának módja`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"md`Legyen adott ${tex`16`} darab kontrollpont:\n\n${tex.block`\nQ_{ij} \\qquad i,j = 0,1,2,3\n`}\n\nEzek alkotják a kontrollhálót. A felületet alkotó pontokat a következő függvény segítségével számolhatjuk\n\n${tex.block`\n S(s, t) = \\sum_{j = 0}^{3}\\sum_{i = 0}^{3}Q_{ij}b_i(s)b_j(t) \\qquad s, t \\in [0, 1],\n`}\n\nahol ${tex`b_j`} és ${tex`b_i`} a harmadfokú Bézier-bázisfüggvények, melyek a következőképpen adottak:\n\n${tex.block`\n\\begin{aligned}\nb_0(t) &= -t^3 + 3t^2 - 3t + 1 \\\\\nb_1(t) &= 3t^3 -6t^2 + 3t \\\\\nb_2(t) &= -3t^3 + 3t^2 \\\\\nb_3(t) &= t^3\n\\end{aligned}\n`}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"md`### A felület háromszögelése`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"md`## Demonstráció`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"md`\nA házi feladathoz tartozó demonstráció a régi jegyzetben található meg, a következő címen:\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"md`\n> https://nbviewer.jupyter.org/github/kompgraf/course-material/blob/master/notebooks/hf-03-bezier-felulet/hf-03-bezier-felulet.ipynb#Demonstr%C3%A1ci%C3%B3\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"