Displacement Map Docs and project ideas


I’ve been playing around with noise and using it to manipulate position and color vertices of a ground plane. The position displacement is custom though and not necessarily like a normal map when using unique designs. My project can be seen here https://mcoons.github.io/noise/

code: https://github.com/mcoons/noise/blob/master/index.js
There is a separate noisefunctions.js file that returns a data object with color and displacement per pixel but I can’t link it.

I then wanted to apply the technique to other objects but soon realized that the vertex order wasn’t something that could easily be parsed in an orderly fashion like with a plane. This led me to Displacement maps after some other failures and googling but I can’t seem to find the documentation on it so I can build a custom map.


  1. Is there documentation I’m not finding?
  2. Is there any other avenue that I could follow to displace object vertices in an order to match my texture colors and their related displacement values?
  3. Any cools ideas I could add to my project?


We support displacement map but more on an offline scenario as they are done per CPU:

We plan to soon support a new WebGL extension named Geometry Shader that will help us do displacement on the GPU.

The problem with displacing object vertices in the vertex shader is the need to recompute normals. And to do so we need to get information about adjacency information.

1 Like

Hi @Deltakosh, is there any news about the Geometry Shader feature? I could use it as well because currently my CPU-generated terrain is consuming too much memory.

This is not for 4.1 unfortunately as we focus our effort on WebGPU first :frowning: