I am converting my materials to node materials, which generally involves replacing modifiers with node modifiers. For example, a material like this: material = new THREE.MeshPhysicalMaterial({ color: 0x0000ff, metalness: 1.0, roughness: 0.7, normalMap: NormalMapAddress, }); becomes material …

In NodeMaterial you would use positionNode – displacement is just a simple case, it can do much more including full vertex animation now.

Thanks! You are right, that should yield an even better result. Because displacement map worked only vertically, I was having to modify the material shaders (using onbeforecompile) to accept horizontal displacements. And, yes, the displacement map will be constantly changing, so I will be attempt…

If you’re updating the vertex positions on every frame, then I’d consider one of: a) directly modify the vertex buffer every frame (fine and easy for lower poly count) b) precompute the position of each vertex for each frame, upload it as one big vertex animation texture, and use positionNode to r…

“vertex animation textures” (this is a common term in Unity and Houdini, worth a google search) are a common way of precomputing the positions of vertices at each frame, sometimes in a DCC tool like Houdini. You don’t need compute shaders, although perhaps that’d be helpful in WebGPU. But if the tr…

Oh, this is what you meant, Phil

Phil means a displacementTexture that is the result of a complex phase space transformation (ifft). Unfortunately, the vertex positions cannot simply be calculated individually and not with a single shader. His displacementTexture is the result of the Cooley-Tukey algorithm. Unfortunately, this alg…

Yes, as @Attila_Schroeder has noted, I am trying to update the vertices using a WebGL ocean simulation that creates a displacement map and a normal map. And I will also want to update to WebGPU so that I can use the superior WebGPU version that @Attila_Schroeder has been creating over the past seve…

Yes, this initial effort was intended to be partly for my benefit and partly for the benefit of anyone else who wants to use the WebGL version of the ocean shader with nodes. Of course, that may soon be obsolete once people start switching to WebGPU.

Now that I have had a chance to re-read your responses and review some code - is the gist of what you are both saying is that this is not a texture issue in that node textures do not make changes to vertices (using displacement maps or otherwise) and that all changes to vertices are made by changing…

How Do I Add Displacement Maps to Node Materials?

Questions

phil_crowther December 4, 2023, 7:41pm 5

With “b” are you suggesting that the precomputation be performed en masse, using a compute shader?

Topic		Replies	Views
Why is There a Visible Seam with my Nodes PositionNode? Questions materials , nodes	4	183	April 6, 2024
Regarding Displacement Maps: Does Three.js do Vector Displacement? Questions materials , geometry , displacement-map , displacement	12	2177	June 19, 2023
Material displacement map makes the texture unwrap the model's surfaces Questions materials , displacement-map	10	4189	November 2, 2019
Add displacement map in the loaded 3D mode Questions textures , materials , loaders	0	398	November 19, 2022
How to work with displacement Map Questions textures , materials	4	1430	September 17, 2021

How Do I Add Displacement Maps to Node Materials?

Related topics