Three.js第七课-雾

375 阅读1分钟

雾分为线性雾指数雾

线性雾(Linear Fog)

线性雾是最简单的一种雾效果,它根据物体与相机之间的距离线性地减少其可见度。离相机越远的物体将被雾效果遮蔽得更多,从而呈现出逐渐消失的效果。

在three.js中,你可以使用Three.Fog来创建线性雾效果。具体的API如下:

Three.Fog(color,near,far)

  • color:表示雾的颜色,可以使用十六进制表示法或RGB值表示。
  • near:表示离相机的近处,距离小于该值的物体将完全被雾覆盖。
  • far:表示离相机的远处,距离大于该值的物体将不受雾的影响。
scene.fog=new Three.Fog(0x999999,0.1,50)

指数雾(Exponential Fog)

指数雾是一种更加浓密、逼真的雾效果,它根据物体与相机之间的距离的指数函数来减少可见度。离相机越远的物体受雾效果的影响更大,呈现出更浓密的效果。

在three.js中,你可以使用FogExp2来创建指数雾效果。具体的API如下:

Three.FogExp2(color,density)

  • color:表示雾的颜色,可以使用十六进制表示法或RGB值表示。
  • density:表示雾的密度,值越大表示雾效果越浓密。
scene.fog=new Three.FogExp2(0x999999,0.1)

image.png