我在2022年使用cesium做了一些效果。
现在记录一下。
1-发光路灯
远处的发光点,是在createCommand()方法中写顶点与片元着色器来实现。
近处切换为,通过Cesium.ModelInstanceCollection方式加载的海量glb模型
![](https://img-blog.csdnimg.cn/img_convert/86f60ec3f150d83605b5890480fda9fe.gif)
2-3dTiles建筑动画
使用Cesium.CustomShader()接口来实现
传入2张图片,底图+“线段图”
在shader中使得“线段图”进行上下移动
![](https://img-blog.csdnimg.cn/img_convert/76570e5e93c35a4c1a4580a2a35bc3bb.gif)
3-渐变动画围墙
自定义MaterialProperty
接收底图和“横线图”2张图片,“横线图”进行上下移动
在围栏顶部,通过smoothstep增加了一个渐变消失的效果
![](https://img-blog.csdnimg.cn/img_convert/44f274e2c79b89c418567c07288fcdbd.gif)
4-流动道路
自定义MaterialProperty,解决了“空帧”的问题,即某一刻所有道路全部消失
![](https://img-blog.csdnimg.cn/img_convert/b75c659c51d28b14ce5964e2004edd80.gif)
5-建筑纹理渐变和光照效果
![](https://img-blog.csdnimg.cn/img_convert/89b7bcb552badf99ed4b2ae92ce2b074.gif)
6-渐变线
![](https://img-blog.csdnimg.cn/img_convert/63aac8d3155bd44b84d51339ba076a75.png)
7-线段各种发光效果
![](https://img-blog.csdnimg.cn/img_convert/590d8bb2ac4cf8368cec87196d43b993.png)