场景特效

6/8/2023

平台支持一些场景特效,包括 雾天气,雨天气,雪天气, 泛光特效,亮度效果,夜视效果,黑白效果,马赛克效果,景深效果 等。

# 1. 特效的底层实现:后处理(Post Processing)

特效底层是使用后处理(Post Processing)来实现,后期处理的过程有点类似于照片的PS。生活中拍摄了一张自拍照,看到照片后发现它太暗了,于是我们增加亮度得到了一张新的照片。在增加亮度后发现脸上的痘痘清晰可见,这可不是我们希望的效果,于是再进行一次美肤效果处理。在这之后可能还会进行n次别的操作,直到满足我们的要求。上述这个过程和三维里面的后期处理流程非常类似:拍的原始照片相当于三维场景中实际渲染得到的效果,在此基础上进行物体描边、夜视效果、环境光遮蔽等后期处理,最后渲染到场景中的图片相当于定版的最终照片。整个过程如下图所示:

image

# 2. 特效类型清单

特效均是继承自BaseEffect (opens new window)类的子类对象。

目前有以下类型:

功能 类名 功能示例
对象描边 mars3d.effect.OutlineEffect (opens new window) 查看 (opens new window)
对象泛光 mars3d.effect.BloomTargetEffect (opens new window) 查看 (opens new window)
雾天气 mars3d.effect.FogEffect (opens new window) 查看 (opens new window)
雾天气 mars3d.effect.RainEffect (opens new window) 查看 (opens new window)
雪天气 mars3d.effect.SnowEffect (opens new window) 查看 (opens new window)
地面积雪 mars3d.effect.SnowCoverEffect (opens new window) 查看 (opens new window)
颜色校正 mars3d.effect.ColorCorrectionEffect (opens new window) 查看 (opens new window)
泛光特效 mars3d.effect.BloomEffect (opens new window) 查看 (opens new window)
亮度效果 mars3d.effect.BrightnessEffect (opens new window) 查看 (opens new window)
马赛克效果 mars3d.effect.MosaicEffect (opens new window) 查看 (opens new window)
景深效果 mars3d.effect.DepthOfFieldEffect (opens new window) 查看 (opens new window)
夜视效果 mars3d.effect.NightVisionEffect (opens new window) 查看 (opens new window)
黑白效果 mars3d.effect.BlackAndWhiteEffect (opens new window) 查看 (opens new window)

# 3. 特效的使用

平台的所有场景特效类都继承于BaseEffect类 (opens new window) ,场景特效类均在mars3d.effect.*命名空间下面。 下面我们演示创建一个场景特效对象 ,并调用map.addEffect添加到地图上。

控件类型清单请访问EffectType (opens new window)

//雨效果
var rainEffect = new mars3d.effect.RainEffect({
    speed: 10,
})
map.addEffect(rainEffect) 
1
2
3
4
5

# 3.1. 运行效果

新窗口查看
最后更新: 5/2/2024, 10:42:33 PM