javascript - 在 Cesium 中，动态旋转罗盘在经过 360 度时会向后重置为 0

Question

我有这个简单的代码来为罗盘图标制作动画，以反射(reflect) Cesium 中相机的当前方向，但是，每当我经过 360 度时，罗盘向左旋转以重置为 0，而不是旋转穿过。代码如下:

viewer.camera.changed.addEventListener(rotateCompass);
viewer.camera.moveEnd.addEventListener(rotateCompass);

function rotateCompass() {
    document.getElementById('compass').style.transform = 
        `rotate(-${viewer.camera.heading}rad)`;
}

Answer 1

找到了一个解决方案，将监听器绑定(bind)到 viewer.clock.onTick 而不是在相机上自行更改。指南针现在仅需 1 个监听器和 1 个函数即可很好地反射(reflect)相机航向:

viewer.clock.onTick.addEventListener(rotateCompass);

function rotateCompass() {
    compass.style.transform = `rotate(${viewer.camera.heading}rad)`;
}