经纬志
首页 / Cesium / 使用示例

点击爆出的星芒

用后处理在点击位置绘制放射状星芒,并用进度值控制扩散与淡出。

CesiumJS 1.121 · 更新 2026-10-28
源码与运行效果
运行效果

坐标怎么换算

拾取得到的是世界坐标,星芒需要屏幕坐标。用 SceneTransforms.worldToWindowCoordinates 换成像素位置,再除以画布尺寸并翻转 y 轴,得到 0 到 1 的纹理坐标。

星芒的形状

角度用来生成射线:abs(sin(angle * 10)) 的 12 次方把正弦压成尖峰,得到 20 条细射线。半径上再用平滑函数做出扩散前沿。

进度为什么要缓动

progress 单调增加并钳在 0.55,射线前沿因此先冲到落点外再淡出。若直接跳变,视觉上会像闪了一下。

uniform类型说明
centerCartesian2爆点屏幕坐标,0 到 1
progressfloat扩散进度 0 到 0.55
worldToWindowCoordinates函数世界坐标转屏幕像素
pickPosition函数拾取三维表面位置

在地球外的空白处点击时拾取为空,示例会先回退到 pickEllipsoid,两者都为空才放弃。