如何仅在特定实体上触发光标保险丝

问题描述

我以这种方式设置了相机和光标:

    <a-camera>
      <a-cursor 
        fuse="true"
        animation__fusing="property: scale; startEvents: fusing; easing: easeInCubic; dur: 1500; from: 1 1 1; to: 0.1 0.1 0.1"
        animation__mouseleave="property: scale; startEvents: mouseleave; easing: easeInCubic; dur: 500; to: 1 1 1">
      </a-cursor>
    </a-camera>

还有一个看起来像这样的场景:

    <a-entity id="scene1">
      <a-Box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" onclick="changeLevel('scene1','scene2')"></a-Box>
      <a-sky src="background1.png"></a-sky>
    </a-entity>

现在,即使看着天空盒,光标也始终处于融合状态。仅当查看可单击的实体时才可以启动融合动画吗? 谢谢

解决方法

您可以通过raycaster component配置光标。就您而言:

  <a-cursor fuse="true" raycaster="objects: a-box" ....

您可以为交互式对象设置一个类,以使其清晰明了:

  <a-box class="clickable"></a-box>
  ...
  <a-cursor raycaster="objects: .clickable" ...

签出here