cursor="rayOrigin: mouse" 可以用來宣告滑鼠點擊事件(可以是mouse游標或是entity本身-例如把一個小圓圈當作visual cursor使用,可使用於像google cardboard這類沒有滑鼠控制的情境)

<a-entity id="camera" position="0 1.6 0" camera look-controls wasd-controls>        
  <a-entity cursor="rayOrigin: mouse"></a-entity>      
</a-entity>

光标组件允许我们通过点击和凝视与实体交互。光标组件被用于 光线投射(raycaster)来实现:

当鼠标单击时,与光标相交的最近可见实体(如果有)将发出 **单击**事件。注意光标组件只是应用了光线投射行为。要为光标提供形状或外观,可以应用 geometry和 material组件。

(以上摘自中文教程)

這個中文教程的aframe版本是0.5.0,現在的官方版本已經到了1.0.0 以及1.0.4(測試版)。接下來的介紹是針對1.0.0版。

**每次新建一個場景,并不會出現光標,而是需要通過新建一個相機來添加。**比如:

<script src="<https://cdn.jsdelivr.net/gh/donmccurdy/[email protected]/dist/aframe-extras.min.js>"></script>
<a-entity camera wasd-controls look-controls="pointerLockEnabled: true">
  <a-entity cursor="fuse: true; fuseTimeout: 500"
            position="0 0 -1"
            geometry="primitive: ring; radiusInner: 0.02; radiusOuter: 0.03"
            material="color: black; shader: flat">
  </a-entity>
</a-entity>

這段指令首先創建了一個entity,并具有camera(相機,也是視角),look-controls(鼠標拖拽來移動視角)和wasd-controls(鍵盤wasd來移動)的功能。在這個功能的子分類中,再次建立一個entity 並含有cursor的功能,并置於position="0 0 -1"的位置。這一步是爲了能讓cursor固定在視角正前方。然後宣告這個cursor的形狀,這裏用了ring,也可以用其他形狀代替。最後設置了cursor的顔色。

cursor的屬性都包括:

downEvents: 好像是用vive的時候可以出發mouse-down效果(沒有vive,沒用過)

fuse: 光標是否做凝視動作, true or false (手機沒有按鈕可以用這個功能)