3D preglednik: 4 koraka

2025 Autor: John Day | [email protected]. Zadnja promjena: 2025-01-23 14:47

Zdravo! Kako bih zadovoljio svoj interes u programiranju i nadam se da ću zadovoljiti vaše, želio bih vam pokazati 3D preglednik koji sam kodirao u javascriptu. Želite li proširiti svoje razumijevanje 3D igara ili čak stvoriti vlastitu 3D igru, ovaj prototipni 3D preglednik savršen je za vas.

Korak 1: Teorija

Da biste razumjeli teoriju ovog 3D preglednika, možete jednostavno ispitati način na koji gledate svoju okolinu (pomaže imati samo jedan značajan izvor svjetlosti). Primijeti da:

1. Objekti koji su udaljeniji od vas zauzimaju manji dio vašeg vidnog polja.
2. Objekti koji su udaljeniji od izvora svjetlosti izgledaju tamnije boje.
3. Kako površine postaju paralelnije (manje okomite) na izvor svjetlosti, postaju tamnije boje.

Odlučio sam predstaviti vidno polje s hrpom linija koje proizlaze iz jedne točke (analogno očnoj jabučici). Poput šiljaste kugle, linije moraju biti ravnomjerno razmaknute kako bi se osiguralo da je svaki dio vidnog polja jednako zastupljen. Na gornjoj slici primijetite kako se linije koje dolaze od šiljaste kugle sve više razmiču dok se udaljavaju od središta loptice. To pomaže vizualizirati provedbu programa promatranja 1 budući da se gustoća linija smanjuje kako se objekti odmiču dalje od središnje točke.

Linije su osnovna jedinica vida u programu, a svaka je preslikana u piksel na zaslonu. Kad linija presijeca objekt, odgovarajući piksel je obojen na temelju udaljenosti od izvora svjetlosti i kuta od izvora svjetlosti.

Korak 2: Teorija implementacije

Radi pojednostavljenja programa, izvor svjetlosti isti je kao središnja točka (očna jabučica: točka s koje se vidi karta i odakle proizlaze linije). Analogno držanju svjetla tik do lica, ovo uklanja sjene i omogućuje mnogo lakše izračunavanje svjetline svakog piksela.

Program također koristi sferne koordinate sa središnjom točkom vidljivosti na ishodištu. To omogućuje lako generiranje linija (svaka s jedinstvenim theta: vodoravnim kutom i phi: okomiti kut), te daje osnovu za izračune. Linije s istim theta preslikane su u piksele u istom retku. Phis odgovarajućih kutova povećava se u svakom retku piksela.

Radi pojednostavljenja matematike, 3D karta se sastoji od ravnina sa zajedničkom varijablom (zajednički x, y ili z), dok su druge dvije neuobičajene varijable ograničene unutar raspona, čime se dovršava definicija svake ravnine.

Da biste pogledali okolo mišem, jednadžbe programa čine faktor okomite i vodoravne rotacije tijekom pretvorbe između sfernih i xyz koordinatnih sustava. To ima učinak pretformiranja rotacije na nizu vidnih linija "šiljasta kugla".

Korak 3: Matematika

Sljedeće jednadžbe omogućuju programu da odredi koje linije presijecaju svaki objekt i podatke o svakom raskrižju. Izveo sam ove jednadžbe iz osnovnih jednadžbi sfernih koordinata i 2D jednadžbi rotacije:

r = udaljenost, t = theta (vodoravni kut), p = phi (okomiti kut), A = rotacija oko osi Y (okomita rotacija), B = rotacija oko osi Z (vodoravna rotacija)

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

rasvjeta = Klight/r*(Kx ili Ky ili 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)))

Korak 4: Program

Nadam se da vam je ovaj prototipni 3D preglednik pomogao razumjeti funkcioniranje 3D virtualne stvarnosti. Uz još usavršavanja i kodiranja, ovaj gledatelj zasigurno ima potencijal koristiti u razvoju 3D igara.