Threejs从高度图变形网格

时间:2015-09-18 19:51:13

标签: three.js mesh heightmap

如何在three.js中使用高度图变形已创建的网格?我做了一些搜索,但找不到任何东西,所以我在这里问。

1 个答案:

答案 0 :(得分:3)

You are lucky, three.js-r72 introduced vertex displacement in the MeshPhongMaterial. You set the displacement map like a normalMap:

var displacementMap = THREE.ImageUtils.loadTexture( "textures/ninja/displacement.jpg" );

var material = new THREE.MeshPhongMaterial( {
                color: 0x0a0100,
                //...
                displacementMap: displacementMap,
                displacementScale: 2.436143,
                displacementBias: - 0.428408,
            } );

scale: The amount of displacement, "how tall are your spikes"

bias: Shift the center up or down

Official Example: http://threejs.org/examples/#webgl_materials_displacementmap