cesium的场景渲染事件

1,893 阅读2分钟

导读

犹如前端系统中浏览器或者框架中的各类事件的应用,例如各种鼠标事件、渲染调度,在cesium中同样拥有相应的事件机制,特别是Cesium中的几个场景事件。

场景事件

  • scene.preUpdate 场景更新之前

image.png

  • scene.postUpdate 场景更新之后立即执行

image.png

  • scene.preRender 场景渲染之前

image.png

  • scene.postUpdate 场景渲染之后

image.png

渲染循环

cesium会默认开启渲染循环RenderLoop

viewer.useDefaultRenderLoop = false // 关闭Cesium场景自动渲染
viewer.render() // 主动触发Ceisum场景渲染
//也可以在初始化就关闭场景的自动渲染

如要使用上述的场景事件,我们可以这样:

scene.preUpdate.addEventListener(callback)
scene.postUpdate.addEventListener(callback)
scene.preRender.addEventListener(callback)
scene.postUpdate.addEventListener(callback)

移除事件我们可以:

scene.preUpdate.removeEventListener(callback)
scene.postUpdate.removeEventListener(callback)
scene.preRender.removeEventListener(callback)
scene.postUpdate.removeEventListener(callback)

注意事项

从官方的描述中,最难以理解的就是scene.postUpdatescene.preRender了。我们可能会想,要是更新后马上就渲染不就是没有区别了吗,甚至我们添加监听事件测试在控制台输出时也能看到两个事件几乎同时触发,不就真的等同于没有区别了?但其实不是的。

Cesium我们知道其渲染最终是通过WebGL实现的,在更新之后要想成功渲染,也必须对Scene中所有的对象对应地在WebGL中的上下文进行对应的更新,包括相机、光源、地球、模型和图元等等。然后,Cesium还必须重新计算那些视图矩阵和投影矩阵,以及光源的位置和方向,甚至还有上述对象的裁剪以及排序,以便进行正确地绘制。因此,在更新和渲染两大过程之间,Cesium还是有着大量的工作要做的,我们是绝对不可以简单把scene.postUpdatescene.preRender视为等同,也正是如此,一些DOM相关的事件我们都是放在scene.preRender里的而不是scene.postUpdate

参考文章