In this project, we’re looking at fixing the gaps and lighting discontinuities between different levels of detail. This is a natural problem that arises when placing 3d meshes of different resolutions side by side. Since we use generate different levels of detail using a quadtree, each chunk is a separate renderable which leads to natural problems when they’re placed side by side.

This is a continuation of our series on 3d world generation and procedural terrain, which started with height maps and basic 3d worlds. In the last video in the series, we tackled using logarithmic depth buffers to fix planetary scale problems with the dept buffer, as well as tackling issues with precision in the fragment shaders.

This is all Three.js/WebGL/JavaScript, but should be easy enough to port to Unity or Godot or whatever your working environment is.

Full playlist for 3D World Generation: https://www.youtube.com/playlist?list… ​

Subscribe: https://www.youtube.com/channel/UCEwhtpXrg5MmwlH04ANpL8A

#3d #javascript