x3d TimeSensor 在点击时暂停和恢复

x3d TimeSensor pause and resume on click

我在 x3d 中实现了一个可爱的太阳系,几个小时以来我一直在尝试做的事情是用鼠标单击一下停止行星的旋转,"works" :

<TimeSensor DEF='clockSol' id='clockSol' cycleInterval='80' loop='true' enabled='true' />
...
<OrientationInterpolator DEF='interRotacion'  key='0 0.25 0.5 0.75 1' keyValue='0 1 0 0  0 1 0 1.57079  0 1 0 3.14159  0 1 0 4.71239  0 1 0 6.28317'/>
...
<ROUTE fromNode='clockSol' fromField='fraction_changed' toNode='interRotacion' toField='set_fraction'></ROUTE>
<ROUTE fromNode='interRotacion' fromField='value_changed' toNode='RotacionSol' toField='set_rotation'></ROUTE>
*............*

这就是太阳动画的实现。

点击事件如下:

document.getElementById('Sol').addEventListener('click',
        function() { 
            if(document.getElementById('clockSol').getAttribute('enabled') == 'true' )
                document.getElementById('clockSol').setAttribute('enabled', 'false');
            else
                document.getElementById('clockSol').setAttribute('enabled', 'true');
        }, false);

这有效地停止了动画,因为它禁用了节点,但是当我恢复动画时,内部循环似乎并没有停止。 结果是,当我再次单击并恢复动画时,对象闪烁到一个新位置,而不是像应该的那样平滑地恢复旋转。

有什么办法吗?

'enable' 字段只是阻止 TimeSensor 发送时间事件,它不会 'stop' 或 'pause' 传感器。您想要的是将当前时间(可从 'time' 字段或其他位置获得)发送到 pauseTime 字段。这会将 TimeSensor 冻结在当前状态。要恢复,请将当前时间发送到 resumeTime。

http://www.web3d.org/documents/specifications/19775-1/V3.2/Part01/components/time.html#TimeSensor

查看 TimeSensor 的完整定义

X3DOM:http://doc.x3dom.org/author/Time/TimeSensor.html

如果您尝试在 X3DOM 中暂停和恢复 TimeSensor,请注意此功能在 1.8.1 及更早版本中未正确实现。有关详细信息,请参阅 this GitHub Issue