WebGL DisplacementMap 与 HeightMap

436 阅读1分钟
  • Displacement Map(置换贴图,也叫移位贴图)可以改变模型对象的几何形状,因此在提供最真实的效果的同时也会大幅增加渲染性能的开销。
  • 只有一个r通道
  • 在顶点着色器里面进行
#ifdef USE_DISPLACEMENTMAP
    uniform sampler2D displacementMap;
    uniform float displacementScale;
    uniform float displacementBias;
#endif

 #ifdef USE_DISPLACEMENTMAP
        transformed += normalize( objectNormal ) * ( texture2D( displacementMap, vUv ).x * displacementScale + displacementBias );
    #endif
vec4 mvPosition = vec4( transformed, 1.0 );

DisplacementMap 与 HeightMap 的区别

  • Displacement mapping can mean (but doesn't always mean) a vector displacement at each point on the surface.
  • Height mapping implies only a scalar displacement value, i.e. each point gets pushed along its normal.
  • HeightMap是地形的输入数据

image.png