Membangun dunia terbuka di browser, bagian 9: Transvoxel dimulai dengan kerangka pengujian
Oleh Oleg Sidorkin, CTO dan Salah Satu Pendiri Cinevva
Baru di sini? Gunakan panduan seri. Panduan tersebut menjelaskan apa itu spike dan memuat tautan ke semua bagian.
Sambungan adalah tempat kepercayaan diri runtuh.
Semuanya dapat terlihat stabil sampai dua resolusi bertemu. Sebuah chunk pada LOD 0 berada di sebelah chunk pada LOD 1. Mesh keduanya dihasilkan secara terpisah. Pada batas yang sama, posisi vertex tidak cocok karena chunk beresolusi lebih rendah memiliki kerapatan grid setengahnya. Hasilnya adalah retakan yang terlihat, T-junction, dan tepi yang berkedip-kedip.
Algoritma Transvoxel mengatasi masalah ini dengan menghasilkan transition cell khusus di sepanjang sisi batas antara dua chunk dengan resolusi berbeda. Cell ini mengambil sampel dari grid beresolusi tinggi dan rendah secara bersamaan, lalu menghasilkan triangle yang menyatukan kedua permukaan. Algoritma ini menggunakan lookup table tersendiri, terpisah dari tabel marching cubes biasa, dengan 512 kasus transition cell.
Pada tahap ini, kami sudah cukup banyak mendapat luka dari proses integrasi sehingga tahu bahwa implementasinya tidak boleh dilakukan secara terburu-buru.
Spike 15 hanya memiliki satu tugas: membangun perangkat uji sambungan yang dapat kami percaya sebelum menyentuh keseluruhan algoritma. Kami menyiapkan lingkungan terkendali berisi dua chunk dengan data SDF yang telah diketahui, ditempatkan berdampingan pada resolusi berbeda, beserta kontrol visualisasi untuk menampilkan atau menyembunyikan mesh utama, mesh sambungan, wireframe, dan normal secara terpisah.
Buka Spike 15 di tab baru ↗ · Lihat kode sumber
Setelah perangkat uji stabil, Spike 16 memvalidasi pembuatan transition cell berbasis tabel pada satu sisi. Kami memilih satu sisi yang sejajar dengan sumbu (batas +X), mengimplementasikan evaluasi transition cell hanya untuk sisi tersebut, lalu membandingkan hasilnya dengan data referensi dari makalah Transvoxel.
Buka Spike 16 di tab baru ↗ · Lihat kode sumber
Kami sengaja menguji satu sisi pada satu waktu karena pengkabelan transition table memiliki banyak mode kegagalan yang independen. Perhitungan indeks kasus bergantung pada pengambilan sampel vertex yang tepat dari kedua grid. Pengindeksan vertex di dalam transition cell menggunakan skema penomoran yang berbeda dari cell marching cubes biasa. Urutan winding harus konsisten dengan mesh utama, atau backface culling akan menghilangkan triangle sambungan. Jika Anda menguji keenam sisi sekaligus, setiap gejala akan tampak acak. Jika Anda menguji satu sisi secara menyeluruh, kegagalan yang muncul akan lebih bermakna dan dapat di-debug.
Keuntungan halus lainnya dari fase ini adalah investasi pada alat bantu. Sejak awal, kami membuat kontrol visibilitas, rendering khusus sambungan, dan indikator LOD berkode warna. Saat itu, kontrol tersebut terasa seperti beban tambahan. Namun kemudian, ketika berbagai kasus sudut mulai rumit, investasi itu terbayar berkali-kali karena kami dapat mengisolasi secara tepat cell sambungan mana yang bermasalah.
Pada akhir bab ini, kami belum "selesai dengan sambungan." Namun, kami sudah berada dalam posisi yang memungkinkan bug sambungan dianalisis alih-alih ditakuti.
Di bagian 10, roller coaster yang sesungguhnya dimulai. Sudut dengan LOD campuran, pembalikan winding, bayangan semu akibat overdraw parsial, dan momen-momen ketika Anda yakin algoritmanya salah, lalu menemukan bahwa bug sebenarnya adalah draw range yang membaca melampaui jumlah vertex aktif.
Teknologi yang dirujuk dalam bab ini
Algoritma Transvoxel. Dirancang oleh Eric Lengyel (transvoxel.org), Transvoxel memecahkan masalah tersulit dalam LOD terrain volumetrik: sambungan antara chunk dengan resolusi berbeda. Ketika chunk beresolusi tinggi berada di sebelah chunk beresolusi rendah, mesh marching cubes tidak sejajar pada batasnya sehingga menghasilkan retakan yang terlihat. Transvoxel menyisipkan transition cell khusus di sepanjang sisi batas untuk menjembatani perbedaan resolusi dengan triangle tambahan yang cocok dengan kedua sisi. Algoritma ini menggunakan lookup table tersendiri (terpisah dari marching cubes biasa) dengan 512 kasus transition cell, yang disederhanakan menjadi 73 kelas ekuivalensi. Algoritma ini bebas paten dan telah digunakan dalam game yang dirilis (Space Engineers, Astroneer). Lihat panduan landscape kami tentang Transvoxel.
Transition cell. Cell khusus yang dihasilkan pada sisi di antara dua tingkat LOD. Tidak seperti cell marching cubes biasa yang mengambil sampel dari 8 sudut pada satu grid, transition cell mengambil sampel dari grid beresolusi tinggi dan rendah secara bersamaan. Sisi beresolusi tinggi memiliki
Sambungan transisi LOD. Batas antara dua resolusi mesh tempat ketidakcocokan topologi menimbulkan artefak visual. Tanpa penyatuan, chunk LOD 0 (grid 1 m) di sebelah chunk LOD 1 (grid 2 m) menghasilkan T-junction: mesh halus memiliki vertex di sepanjang batas yang tidak dimiliki mesh kasar, sehingga menimbulkan retakan yang dapat ditembus cahaya. Transvoxel, geomorphing, dan geometri skirt adalah tiga pendekatan untuk memperbaiki sambungan tersebut. Untuk terrain volumetrik, Transvoxel merupakan solusi standar karena geomorphing hanya dapat digunakan pada heightmap. Lihat LOD untuk terrain volumetrik.
Bagian 9 dari 12.
Sebelumnya: Bagian 8 - Integrasi tanpa kehilangan baseline kami
Berikutnya: Bagian 10 - Kekacauan sambungan dan pertarungan bos di sudut
Panduan seri: /id/blog/2026-02-25-open-world-browser-series-guide