Visor 3D: 4 passos

2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:15

Hola! Per satisfer el meu interès per la programació i, amb sort, ajudar a satisfer el vostre, m'agradaria mostrar-vos un visor 3D que he codificat en javascript. Si voleu millorar la vostra comprensió dels jocs en 3D o fins i tot crear el vostre propi joc en 3D, aquest prototip de visor 3D és perfecte per a vosaltres.

Pas 1: la teoria

Per entendre la teoria d’aquest visor en 3D, simplement podeu examinar la manera de veure el vostre entorn (ajuda a tenir només una font significativa de llum). Adona't que:

1. Els objectes que estan més lluny de vosaltres ocupen una porció més petita del vostre camp de visió.
2. Els objectes més allunyats de la font de llum semblen de color més fosc.
3. A mesura que les superfícies es tornen més paral·leles (menys perpendiculars) a la font de llum, apareixen de color més fosc.

Vaig decidir representar un camp de visió amb un munt de línies que provenien d’un sol punt (anàleg al globus ocular). Igual que una bola d’espiga, les línies s’han de separar uniformement per garantir que cada porció del camp de visió estigui igualment representada. A la imatge superior, observeu com les línies que provenen de la bola espiga es distancien a mesura que s’allunyen del centre de la pilota. Això ajuda a visualitzar la implementació del programa d'observació 1, ja que la densitat de línies disminueix a mesura que els objectes s'allunyen del punt central.

Les línies són la unitat bàsica de visió del programa i estan assignades a un píxel de la pantalla. Quan una línia talla un objecte, el seu píxel corresponent es coloritza en funció de la seva distància a la font de llum i el seu angle respecte a la font de llum.

Pas 2: teoria de la implementació

Per simplificar el programa, la font de llum és la mateixa que el punt central (globus ocular: punt des del qual es visualitza el mapa i d’on provenen les línies). Igual que mantenir una llum al costat de la cara, elimina les ombres i permet calcular la brillantor de cada píxel amb molta més facilitat.

El programa també utilitza coordenades esfèriques, amb el punt de visió central a l’origen. Això permet generar fàcilment les línies (cadascuna amb un theta únic: angle horitzontal i phi: angle vertical) i proporciona la base dels càlculs. Les línies amb el mateix theta es mapen a píxels de la mateixa fila. Els fis dels angles corresponents augmenten a cada fila de píxels.

Per simplificar les matemàtiques, el mapa 3D es compon de plans amb una variable comuna (x, y o z comuns), mentre que les altres dues variables no comuns es limiten a un interval, completant la definició de cada pla.

Per mirar al voltant amb el ratolí, les equacions del programa tenen en compte una rotació vertical i horitzontal durant la conversió entre sistemes de coordenades esfèriques i xyz. Això té l'efecte de preformar una rotació sobre el conjunt de línies de visió "bola d'espiga".

Pas 3: matemàtiques

Les equacions següents permeten al programa determinar quines línies tallen cada objecte i informació sobre cada intersecció. He derivat aquestes equacions de les equacions bàsiques de coordenades esfèriques i de les equacions de rotació 2D:

r = distància, t = theta (angle horitzontal), p = phi (angle vertical), A = rotació sobre l'eix Y (rotació vertical), B = rotació sobre l'eix Z (rotació horitzontal)

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

il·luminació = Klight / r * (Kx o Ky o 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)))

Pas 4: programa

Espero que aquest prototip de visor 3D us ajudi a entendre el funcionament de les realitats virtuals en 3D. Amb una mica més de perfeccionament i codificació, aquest visor té el potencial de ser utilitzat en el desenvolupament de jocs 3D.