3D prehliadač: 4 kroky

2024 Autor: John Day | [email protected]. Naposledy zmenené: 2024-01-30 12:00

Ahoj! Aby som uspokojil svoj záujem o programovanie a dúfajme, že pomôže uspokojiť aj ten váš, rád by som vám ukázal 3D prehliadač, ktorý som kódoval v JavaScripte. Ak by ste chceli lepšie porozumieť 3D hrám alebo si dokonca vytvoriť vlastnú 3D hru, tento prototyp 3D zobrazovača je pre vás ako stvorený.

Krok 1: Teória

Aby ste pochopili teóriu tohto 3D zobrazovača, môžete jednoducho preskúmať spôsob, akým sa pozeráte na svoje okolie (pomáha mať iba jeden významný zdroj svetla). Všimni si:

1. Objekty, ktoré sú od vás ďalej, zaberajú menšiu časť vášho zorného poľa.
2. Objekty, ktoré sú ďalej od zdroja svetla, pôsobia tmavšie.
3. Keď sa povrchy stávajú rovnobežnejšími (menej kolmými) na svetelný zdroj, javia sa ako tmavšie farby.

Rozhodol som sa reprezentovať zorné pole s hromadou čiar pochádzajúcich z jedného bodu (analogického k očnej buľve). Rovnako ako bodcová guľa, čiary musia byť rovnomerne rozložené, aby sa zabezpečilo, že každá časť zorného poľa bude zastúpená rovnako. Na obrázku vyššie si všimnite, ako sa čiary prichádzajúce z bodcovej gule stávajú viac rozmiestnené, keď sa pohybujú ďalej od stredu lopty. To pomáha vizualizovať implementáciu pozorovania 1 v programe, pretože hustota čiar klesá, keď sa objekty pohybujú ďalej od stredového bodu.

Čiary sú základnou jednotkou videnia v programe a každá je mapovaná na pixel na displeji. Keď čiara pretína objekt, jeho zodpovedajúci pixel je zafarbený na základe jeho vzdialenosti od zdroja svetla a jeho uhla od zdroja svetla.

Krok 2: Teória implementácie

Na zjednodušenie programu je svetelný zdroj rovnaký ako stredový bod (očná guľa: bod, z ktorého sa zobrazuje mapa a odkiaľ pochádzajú čiary). Analogicky ako keď držíte svetlo hneď vedľa tváre, eliminuje tiene a umožňuje oveľa jednoduchšie vypočítať jas každého pixelu.

Program tiež používa sférické súradnice so stredovým bodom videnia na začiatku. To umožňuje ľahké generovanie čiar (každá s jedinečnou theta: horizontálny uhol a phi: vertikálny uhol) a poskytuje základ pre výpočty. Riadky s rovnakou theta sú mapované na pixely v rovnakom riadku. Phis zodpovedajúcich uhlov sa zvyšuje v každom rade pixelov.

Na zjednodušenie matematiky je 3D mapa zložená z rovín so spoločnou premennou (spoločné x, y alebo z), zatiaľ čo ďalšie dve neobvyklé premenné sú ohraničené v rámci rozsahu, čím je definícia každej roviny dokončená.

Na rozhliadnutie sa pomocou myši zohľadňujú rovnice programu vertikálne a horizontálne otáčanie počas prevodu medzi sférickými a xyz súradnicovými systémami. To má za následok predbežné otáčanie na súprave línií videnia „spike ball“.

Krok 3: Matematika

Nasledujúce rovnice umožňujú programu určiť, ktoré čiary pretínajú každý objekt, a informácie o každej križovatke. Tieto rovnice som odvodil zo základných rovníc sférických súradníc a rovníc 2D rotácie:

r = vzdialenosť, t = theta (horizontálny uhol), p = phi (vertikálny uhol), A = rotácia okolo osi Y (vertikálna rotácia), B = rotácia okolo osi Z (horizontálna rotácia)

Kx = (sin (p)*cos (t)*cos (A)+cos (p)*sin (A))*cos (B) -sin (p)*sin (t)*sin (B)

Ky = (sin (p)*cos (t)*cos (A)+cos (p)*sin (A))*sin (B)+sin (p)*sin (t)*cos (B)

Kz = -sin (p)*cos (t)*sin (A)+cos (p)*cos (A)

x = r*Kx

y = r*Ky

z = r*Kz

r^2 = x^2+y^2+z^2

osvetlenie = Klight/r*(Kx alebo Ky alebo Kz)

p = arccos ((x*sin (A)*cos (B)+y*sin (A)*sin (B)+z*cos (A))/r)

t = arccos ((x*cos (B)+y*sin (B) -p*sin (A)*cos (p))/(r*cos (A)*sin (p)))

Krok 4: Program

Dúfam, že vám tento prototyp 3D zobrazovača pomohol porozumieť fungovaniu 3D virtuálnych realít. S trochou zdokonaľovania a kódovania má tento prehliadač určite potenciál využiť pri vývoji hier 3D.