Penampil 3D: 4 Langkah

2024 Pengarang: John Day | [email protected]. Terakhir diubah: 2024-01-30 09:57

Halo! Untuk memuaskan minat saya dalam pemrograman dan semoga membantu memuaskan minat Anda, saya ingin menunjukkan kepada Anda Penampil 3D yang saya kodekan dalam javascript. Jika Anda ingin lebih memahami game 3D atau bahkan membuat game 3D Anda sendiri, penampil 3D prototipe ini sangat cocok untuk Anda.

Langkah 1: Teori

Untuk memahami teori penampil 3D ini, Anda cukup memeriksa cara Anda melihat sekeliling Anda (membantu hanya memiliki satu sumber cahaya yang signifikan). Perhatikan itu:

1. Objek yang lebih jauh dari Anda mengambil bagian yang lebih kecil dari bidang penglihatan Anda.
2. Objek yang lebih jauh dari sumber cahaya tampak berwarna lebih gelap.
3. Saat permukaan menjadi lebih paralel (kurang tegak lurus) terhadap sumber cahaya, mereka tampak berwarna lebih gelap.

Saya memutuskan untuk mewakili bidang visi dengan sekelompok garis yang berasal dari satu titik (analog dengan bola mata). Seperti bola paku, garis harus diberi jarak yang sama untuk memastikan bahwa setiap bagian bidang penglihatan terwakili secara merata. Pada gambar di atas, perhatikan bagaimana garis-garis yang datang dari bola spike menjadi lebih berjauhan saat mereka bergerak lebih jauh dari pusat bola. Ini membantu memvisualisasikan implementasi program pengamatan 1 karena kerapatan garis berkurang saat objek bergerak lebih jauh dari titik pusat.

Garis adalah unit dasar penglihatan dalam program, dan masing-masing dipetakan ke piksel di layar. Ketika sebuah garis memotong sebuah objek, pikselnya yang sesuai diwarnai berdasarkan jaraknya dari sumber cahaya dan sudutnya dari sumber cahaya.

Langkah 2: Teori Implementasi

Untuk menyederhanakan program, sumber cahaya sama dengan titik pusat (bola mata: titik dari mana peta dilihat dan dari mana garis-garis itu berasal). Analog dengan memegang lampu tepat di sebelah wajah Anda, ini menghilangkan bayangan dan memungkinkan kecerahan setiap piksel dihitung dengan lebih mudah.

Program ini juga menggunakan koordinat bola, dengan titik pusat penglihatan di titik asal. Ini memungkinkan garis dibuat dengan mudah (masing-masing dengan theta unik: sudut horizontal dan phi: sudut vertikal), dan menyediakan dasar perhitungan. Garis dengan theta yang sama dipetakan ke piksel di baris yang sama. phis dari sudut yang sesuai meningkat di setiap baris piksel.

Untuk menyederhanakan matematika, peta 3D terdiri dari bidang dengan variabel umum (umum x, y, atau z), sedangkan dua variabel non-umum lainnya dibatasi dalam rentang, melengkapi definisi setiap bidang.

Untuk melihat-lihat dengan mouse, faktor persamaan program dalam rotasi vertikal dan horizontal selama konversi antara sistem koordinat bola dan xyz. Ini memiliki efek membentuk rotasi pada set garis penglihatan "bola paku".

Langkah 3: Matematika

Persamaan berikut memungkinkan program untuk menentukan garis mana yang memotong setiap objek dan informasi tentang setiap persimpangan. Saya menurunkan persamaan ini dari persamaan koordinat bola dasar dan persamaan rotasi 2D:

r=jarak, t=theta(sudut horizontal), p=phi(sudut vertikal), A=rotasi terhadap sumbu Y(rotasi vertikal), B=rotasi terhadap sumbu Z(rotasi horizontal)

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

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

Langkah 4: Program

Saya harap prototipe penampil 3D ini membantu Anda memahami cara kerja realitas virtual 3D. Dengan beberapa penyempurnaan dan pengkodean yang lebih, penampil ini tentu memiliki potensi untuk digunakan dalam pengembangan game 3D.