mrdoob/three.js — Issue #1003: Terrain from Heightmap
Author: LiquidSnakeX
Created: 2012-01-02 06:20:12+00:00
State: open

Hi there,
I'm pretty new to Three.js but already it looks very promising, great job guys!

My issue is that I'm trying to create a landscape using a heightmap image but haven't been able to find any good examples of this targeted at Three.js specifically. I have virtually no experience with GLSL shaders but understand the rendering pipeline pretty decently and realize that I'll have to use them at some point in order to offload the heavy-lifting to the GPU.

I think generating it using a noise algorithm might be more efficient but doesn't really suit my project,
at least not until I get better with GLSL...

Ideally I'd like to generate terrain from a heightmap, edit it in game, then be able to save it again (maybe as a new image). I guess the terrain would have to be generated/rendered by a shader to get decent performance, but I know that data sent to the shader(GPU) is a one way trip, so I'm not sure how to go about saving the transformed terrain. If anyone has any ideas or examples on how to handle this I'd greatly appreciate it!

I found Chandler Prall's badass [dynamic terrain example](http://chandler.prallfamily.com/webgl/terrain/) to be very helpful but it lets me down in two ways:
1: It doesn't use a heightmap :[
2: It only works with an older version of Three (// Three.js r41/ROME)

I'd rather not base my project on techniques that are only compatible with an outdated version of the API,
so would anyone know what parts in that example would need to be changed to work with the newer codebase?

I realize I might be asking for a bit much, but I have had a good look and am still stumped by this so any help is welcome.
Thanks muchly