# \#terrain

**URL:** https://discourse.threejs.org/tag/terrain/419.md

[Latest](https://discourse.threejs.org/latest.md) · [Categories](https://discourse.threejs.org/categories.md) · [Tags](https://discourse.threejs.org/tags.md)

---

## [4x4 Builder - Off Road Vehicle Configurator](https://discourse.threejs.org/t/4x4-builder-off-road-vehicle-configurator/20428)

<div class="topic-metadata">

**Author:** [@theshanergy](https://discourse.threejs.org/u/theshanergy)\
**Replies:** 7\
**Last updated:** [October 1, 2026, 5:41am UTC](https://discourse.threejs.org/t/4x4-builder-off-road-vehicle-configurator/20428 "2026-10-01T05:41:36Z")

</div>

https://4x4builder.com 4x4Builder is a feature-rich, browser-based 3D off-road vehicle configurator and driving simulator built with Three.js, React Three Fiber, and Drei, allowing enthusiasts to customize detailed 4…

---

## [Zanpo, Virtual Cities demo](https://discourse.threejs.org/t/zanpo-virtual-cities-demo/87729)

<div class="topic-metadata">

**Author:** [@neurofuzzy](https://discourse.threejs.org/u/neurofuzzy)\
**Replies:** 4\
**Last updated:** [August 21, 2026, 11:52pm UTC](https://discourse.threejs.org/t/zanpo-virtual-cities-demo/87729 "2026-08-21T23:52:26Z")

</div>

Hi all! About 25 years ago I made a Flash-base website called Zanpo, Virtual Cities. It was all 2.5D isometric. I’m recreating the site in three.js and am having a blast. Check out the tech demo here!

---

## [Matter Field: one authored field for GPU (TSL) + CPU consumers - is this a useful contract?](https://discourse.threejs.org/t/matter-field-one-authored-field-for-gpu-tsl-cpu-consumers-is-this-a-useful-contract/93398)

<div class="topic-metadata">

**Author:** [@matthew-kissinger](https://discourse.threejs.org/u/matthew-kissinger)\
**Replies:** 2\
**Last updated:** [August 11, 2026, 3:36pm UTC](https://discourse.threejs.org/t/matter-field-one-authored-field-for-gpu-tsl-cpu-consumers-is-this-a-useful-contract/93398 "2026-08-11T15:36:01Z")

</div>

This mostly came out of building Objekt 62 It has a ~40 km procedural dune world rendered through Three.js/TSL, while gameplay needs immediate CPU queries against that same terrain for collision, placement, vehicles, sl…

---

## [Terrain Rider: Infinite Real-World Physics Based Mountain Bike Game](https://discourse.threejs.org/t/terrain-rider-infinite-real-world-physics-based-mountain-bike-game/92934)

<div class="topic-metadata">

**Author:** [@theshanergy](https://discourse.threejs.org/u/theshanergy)\
**Replies:** 18\
**Last updated:** [August 5, 2026, 6:19pm UTC](https://discourse.threejs.org/t/terrain-rider-infinite-real-world-physics-based-mountain-bike-game/92934 "2026-08-05T18:19:24Z")

</div>

Hey all - I’ve been working on Terrain Rider, a physics-based mountain biking game that runs in the browser. It’s built with Three.js / React Three Fiber and Rapier, with procedural terrain, bike customization, timed …

---

## [Eternal Ride: Infinite Terrain in Three.js with No LOD, No Seams](https://discourse.threejs.org/t/eternal-ride-infinite-terrain-in-three-js-with-no-lod-no-seams/91868)

<div class="topic-metadata">

**Author:** [@red-reddington](https://discourse.threejs.org/u/red-reddington)\
**Replies:** 3\
**Last updated:** [May 29, 2026, 5:04am UTC](https://discourse.threejs.org/t/eternal-ride-infinite-terrain-in-three-js-with-no-lod-no-seams/91868 "2026-05-29T05:04:39Z")

</div>

TL;DR - This post and demo show how to do truly massive infinite terrain in Three.js without the usual LOD stitching nightmare. The terrain is a pure math function evaluated per-vertex on the GPU and per-sample on the C…

---

## [3d-Tiles-Renderer: A 3D Tiles implementation for three.js from NASA JPL](https://discourse.threejs.org/t/3d-tiles-renderer-a-3d-tiles-implementation-for-three-js-from-nasa-jpl/44136)

<div class="topic-metadata">

**Author:** [@gkjohnson](https://discourse.threejs.org/u/gkjohnson)\
**Replies:** 31\
**Last updated:** [May 22, 2026, 12:40am UTC](https://discourse.threejs.org/t/3d-tiles-renderer-a-3d-tiles-implementation-for-three-js-from-nasa-jpl/44136 "2026-05-22T00:40:31Z")

</div>

Hey guys! It’s been around for a while now but I wanted to share the 3d-tiles-renderer project I worked on and open sourced years ago from NASA JPL! For a couple of our Mars missions now we’ve been producing 3d tiles dat…

---

## [Alien Underwater World](https://discourse.threejs.org/t/alien-underwater-world/90095)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 3\
**Last updated:** [March 6, 2026, 1:19pm UTC](https://discourse.threejs.org/t/alien-underwater-world/90095 "2026-03-06T13:19:12Z")

</div>

Hi community! Picture: Demo: https://codepen.io/prisoner849/full/dPpbpGV The idea was taken from a YT video on Blender on how to generate interesting landscapes/terrains. Instead of applying the stacked value of s…

---

## [Terrain height map banding](https://discourse.threejs.org/t/terrain-height-map-banding/53849)

<div class="topic-metadata">

**Author:** [@DolphinIQ](https://discourse.threejs.org/u/DolphinIQ)\
**Replies:** 12\
**Last updated:** [February 24, 2026, 11:37am UTC](https://discourse.threejs.org/t/terrain-height-map-banding/53849 "2026-02-24T11:37:03Z")

</div>

Hello :wave: Im making a terrain system. I have a 1024x1024 PNG height map from which I sample height and apply it to my 1024x1024 wide terrain (on the CPU). The vertices are displaced and the computed normals seem good…

---

## [XEngine - a game designer with Rapier based on the old school Resident Evil (Updated)](https://discourse.threejs.org/t/xengine-a-game-designer-with-rapier-based-on-the-old-school-resident-evil-updated/89596)

<div class="topic-metadata">

**Author:** [@leonsxia](https://discourse.threejs.org/u/leonsxia)\
**Replies:** 1\
**Last updated:** [February 3, 2026, 12:13pm UTC](https://discourse.threejs.org/t/xengine-a-game-designer-with-rapier-based-on-the-old-school-resident-evil-updated/89596 "2026-02-03T12:13:38Z")

</div>

Update 2026.02.01 After 1 year of development and testing, the engine now includes some new features: Integrated with Rapier Physics Editable high-resolution terrain Enemies and combat Personal Digital Assit…

---

## [A lightweight tile map using threejs : three-tile](https://discourse.threejs.org/t/a-lightweight-tile-map-using-threejs-three-tile/85383)

<div class="topic-metadata">

**Author:** [@sxguojf](https://discourse.threejs.org/u/sxguojf)\
**Replies:** 4\
**Last updated:** [July 25, 2025, 2:14pm UTC](https://discourse.threejs.org/t/a-lightweight-tile-map-using-threejs-three-tile/85383 "2025-07-25T14:14:49Z")

</div>

three-tile is a lightweight 3D tile map library developed based on threejs. It offers advantages such as ease of use and low resource consumption, and provides a lightweight 3D terrain model suitable for adding 3D maps t…

---

## [Community Balloons](https://discourse.threejs.org/t/community-balloons/81601)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 7\
**Last updated:** [April 25, 2025, 3:12pm UTC](https://discourse.threejs.org/t/community-balloons/81601 "2025-04-25T15:12:25Z")

</div>

Hi community! Picture: Demo: https://codepen.io/prisoner849/full/VYYPmVG A small sketch with a procedurally generated almost everything (except those community logos on balloons). Inspired with listening of - old …

---

## [Zafiro - early Three.js world-creation prototype (2024)](https://discourse.threejs.org/t/zafiro-early-three-js-world-creation-prototype-2024/73402)

<div class="topic-metadata">

**Author:** [@bartoszu](https://discourse.threejs.org/u/bartoszu)\
**Replies:** 4\
**Last updated:** [October 30, 2024, 12:39pm UTC](https://discourse.threejs.org/t/zafiro-early-three-js-world-creation-prototype-2024/73402 "2024-10-30T12:39:14Z")

</div>

Update — July 2026 This thread documents an early Zafiro prototype shared in October 2024. The screenshots below are kept for historical context and no longer represent the current state of the project. The closest co…

---

## [Infinite Render Distance](https://discourse.threejs.org/t/infinite-render-distance/73391)

<div class="topic-metadata">

**Author:** [@Owen\_Odroski](https://discourse.threejs.org/u/Owen_Odroski)\
**Replies:** 2\
**Last updated:** [October 29, 2024, 9:13pm UTC](https://discourse.threejs.org/t/infinite-render-distance/73391 "2024-10-29T21:13:09Z")

</div>

Hello Three.js Community! I am trying to make a game that requires the camera to be high above the ground. I want it to look like the world goes on forever, like if you were really high IRL. I want it to look like Cesiu…

---

## [Tesseract - Open World Planetary Engine](https://discourse.threejs.org/t/tesseract-open-world-planetary-engine/1473)

<div class="topic-metadata">

**Author:** [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Replies:** 51\
**Last updated:** [June 20, 2024, 5:02pm UTC](https://discourse.threejs.org/t/tesseract-open-world-planetary-engine/1473 "2024-06-20T17:02:19Z")

</div>

I’d like to introduce one of my spartime projects i’m wroking on. It’s going for about a year now and slowly becomes complete. I’ll drop updates of progress as it proceeds. About a y…

---

## [Letterfall \[on terrain\]](https://discourse.threejs.org/t/letterfall-on-terrain/64484)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 4\
**Last updated:** [May 3, 2024, 6:43pm UTC](https://discourse.threejs.org/t/letterfall-on-terrain/64484 "2024-05-03T18:43:58Z")

</div>

Hi community! Picture: Demo: https://codepen.io/prisoner849/full/vYMvpXX This is an attempt to make a bunch of quad instances, with letters from a texture atlas, to look like a terrain.

---

## [\[ Solved \] Does anyone know how to draw a smooth slope?](https://discourse.threejs.org/t/solved-does-anyone-know-how-to-draw-a-smooth-slope/64377)

<div class="topic-metadata">

**Author:** [@Seiji\_Chishiki](https://discourse.threejs.org/u/Seiji_Chishiki)\
**Replies:** 16\
**Last updated:** [April 28, 2024, 9:01am UTC](https://discourse.threejs.org/t/solved-does-anyone-know-how-to-draw-a-smooth-slope/64377 "2024-04-28T09:01:42Z")

</div>

I have successfully drawn a golf course, but does anyone know how to draw the slopes smooth? The current drawing is lumpy and looks like Minecraft. I use DEM data for drawing terrain.

---

## [Interactive movies in Three.js (Landscapes, Graphics and Libraries)](https://discourse.threejs.org/t/interactive-movies-in-three-js-landscapes-graphics-and-libraries/55419)

<div class="topic-metadata">

**Author:** [@iHast](https://discourse.threejs.org/u/iHast)\
**Replies:** 2\
**Last updated:** [August 27, 2023, 11:18pm UTC](https://discourse.threejs.org/t/interactive-movies-in-three-js-landscapes-graphics-and-libraries/55419 "2023-08-27T23:18:07Z")

</div>

I was researching about projects where the Three.js was used to create landscapes, tours or simple movies with camera movements using GSAP or theater.js. I didn’t saw much projects with this approach. I know we can use …

---

## [ML Terraform - Neural Network Terrain Generator](https://discourse.threejs.org/t/ml-terraform-neural-network-terrain-generator/9458)

<div class="topic-metadata">

**Author:** [@apseren](https://discourse.threejs.org/u/apseren)\
**Replies:** 2\
**Last updated:** [July 12, 2023, 11:12am UTC](https://discourse.threejs.org/t/ml-terraform-neural-network-terrain-generator/9458 "2023-07-12T11:12:59Z")

</div>

ML Terraform is a Terrain Generator implemented using a Neural Network trained on handmade 3d models. It is now available as a web tool at https://apseren.com/mlterraform/?fullscreen=true Let me know what you th…

---

## [Close sides for terrain based on displaced vertices of plane geometry](https://discourse.threejs.org/t/close-sides-for-terrain-based-on-displaced-vertices-of-plane-geometry/48035)

<div class="topic-metadata">

**Author:** [@Torstein](https://discourse.threejs.org/u/Torstein)\
**Replies:** 4\
**Last updated:** [February 14, 2023, 10:11pm UTC](https://discourse.threejs.org/t/close-sides-for-terrain-based-on-displaced-vertices-of-plane-geometry/48035 "2023-02-14T22:11:26Z")

</div>

Continuing the discussion from Displacement map / terrain: close sides: Hi there! In my application, Im changing plane geometry heights by moving the mouse over them and adding displacement value to them. But if we …

---

## [Endless way II (single plane)](https://discourse.threejs.org/t/endless-way-ii-single-plane/32142)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 8\
**Last updated:** [December 24, 2022, 6:04am UTC](https://discourse.threejs.org/t/endless-way-ii-single-plane/32142 "2022-12-24T06:04:00Z")

</div>

Hi community! Here is another attempt of creation of endless lowpoly terrain, using one plane only. Thanks to @makc3d, who encouraged me with this idea :beers: Picture: Demo: https://jtnbk.csb.app/ Source code: e…

---

## [Create a thick terrain with height map](https://discourse.threejs.org/t/create-a-thick-terrain-with-height-map/43528)

<div class="topic-metadata">

**Author:** [@hesamoy](https://discourse.threejs.org/u/hesamoy)\
**Replies:** 4\
**Last updated:** [October 12, 2022, 7:38am UTC](https://discourse.threejs.org/t/create-a-thick-terrain-with-height-map/43528 "2022-10-12T07:38:33Z")

</div>

Hello, I want to create layers of earth with the aid of height map. However, when I apply the height map to the top of a BoxGeometry, it does not fill the gap between the sides and the top (the gray image). Is there a w…

---

## [I watched the youtube video and applied the terrain texture to the plain geometry, but it's strange](https://discourse.threejs.org/t/i-watched-the-youtube-video-and-applied-the-terrain-texture-to-the-plain-geometry-but-its-strange/40920)

<div class="topic-metadata">

**Author:** [@mslee98](https://discourse.threejs.org/u/mslee98)\
**Replies:** 1\
**Last updated:** [August 1, 2022, 10:58am UTC](https://discourse.threejs.org/t/i-watched-the-youtube-video-and-applied-the-terrain-texture-to-the-plain-geometry-but-its-strange/40920 "2022-08-01T10:58:02Z")

</div>

When I gltf loader the terrain created with blender plain with three.js, only the plane comes out, is there a solution?

---

## [Low-Poly Terrain Demo (WIP)](https://discourse.threejs.org/t/low-poly-terrain-demo-wip/33859)

<div class="topic-metadata">

**Author:** [@nikolas.karinja](https://discourse.threejs.org/u/nikolas.karinja)\
**Replies:** 0\
**Last updated:** [January 20, 2022, 5:34am UTC](https://discourse.threejs.org/t/low-poly-terrain-demo-wip/33859 "2022-01-20T05:34:30Z")

</div>

Evening Everyone, After weeks of work yet years of learning Three.js, I came up with a simple demo for my new studio (Lotech Studios) to show of the abilities of WebGL Engine. This of course utilizes Three.js as its bas…

---

## [Endless way (two planes loop)](https://discourse.threejs.org/t/endless-way-two-planes-loop/31709)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 3\
**Last updated:** [January 4, 2022, 8:49am UTC](https://discourse.threejs.org/t/endless-way-two-planes-loop/31709 "2022-01-04T08:49:01Z")

</div>

Hi community! Here is an attempt of creation of endless way on a lowpoly terrain, looping two planes (Terrain.js module in the source code) Picture: Demo: https://ed1ov.csb.app/ Source code: admiring-sea-ed1ov - C…

---

## [Generating terrain on top of random meshes](https://discourse.threejs.org/t/generating-terrain-on-top-of-random-meshes/25572)

<div class="topic-metadata">

**Author:** [@vin-ni](https://discourse.threejs.org/u/vin-ni)\
**Replies:** 1\
**Last updated:** [April 22, 2021, 8:31am UTC](https://discourse.threejs.org/t/generating-terrain-on-top-of-random-meshes/25572 "2021-04-22T08:31:41Z")

</div>

Hello everyone, I’m trying to generate a terrain on top of random meshes for a player to walk on. I figured, I would then hide the terrain and the players camera would do a Raycast from above the terrain to always stay …

---

## [Map33.js v0.1, a library to build 3D maps](https://discourse.threejs.org/t/map33-js-v0-1-a-library-to-build-3d-maps/16877)

<div class="topic-metadata">

**Author:** [@maxmre](https://discourse.threejs.org/u/maxmre)\
**Replies:** 1\
**Last updated:** [September 6, 2020, 5:50am UTC](https://discourse.threejs.org/t/map33-js-v0-1-a-library-to-build-3d-maps/16877 "2020-09-06T05:50:09Z")

</div>

Long story short, I took what I liked most about droneWorld (cf. https://discourse.threejs.org/t/3d-world-engine-droneworld-prototype/1501), ie. making 3D terrain and started from scratch to build a library that, hopeful…

---

## [Is there any terrain height simulator library available?](https://discourse.threejs.org/t/is-there-any-terrain-height-simulator-library-available/10788)

<div class="topic-metadata">

**Author:** [@yusuf\_nazir](https://discourse.threejs.org/u/yusuf_nazir)\
**Replies:** 0\
**Last updated:** [November 12, 2019, 5:59pm UTC](https://discourse.threejs.org/t/is-there-any-terrain-height-simulator-library-available/10788 "2019-11-12T17:59:06Z")

</div>

I am looking for a library for three.js which can help in creating an uneven terrain. In time i would want to simulate rainfall on that terrain so see how the water would flow through it. And also define different types …

---

## [Generate new terrain on movement](https://discourse.threejs.org/t/generate-new-terrain-on-movement/4763)

<div class="topic-metadata">

**Author:** [@capotasto](https://discourse.threejs.org/u/capotasto)\
**Replies:** 11\
**Last updated:** [November 2, 2018, 9:36pm UTC](https://discourse.threejs.org/t/generate-new-terrain-on-movement/4763 "2018-11-02T21:36:49Z")

</div>

I’m quite new to three.js and to 3D in general, so I might be in over my head here. I’ve generated a patch of terrain using plane and simplex noise, and would like to generate new terrain as a player moves across it. W…

---

## [How can I add 3D map as background for page?](https://discourse.threejs.org/t/how-can-i-add-3d-map-as-background-for-page/1224)

<div class="topic-metadata">

**Author:** [@usematics](https://discourse.threejs.org/u/usematics)\
**Replies:** 8\
**Last updated:** [March 3, 2018, 4:39pm UTC](https://discourse.threejs.org/t/how-can-i-add-3d-map-as-background-for-page/1224 "2018-03-03T16:39:57Z")

</div>

Hey hello. I’m a complete new to three js. I saw this Washington Post article https://www.washingtonpost.com/graphics/2017/world/mapping-the-dmz I’ll like to learn how to do that map. I work with National Parks and some…