Question

我使用a-frame来做web-vr。我很高兴使用，但我有一些情况不知道如何实施。首先，我将带有光标的相机设置为与对象＆＃34; .trigger＆＃34;相交的raycaster。

<a-entity camera="" look-controls="" position="" rotation="" scale="" visible=""> <a-entity cursor="fuse: true; fuseTimeout: 1500" position="0 0 -1" geometry="primitive: ring; radiusInner: 0.02; radiusOuter: 0.03" material="color: cyan; shader: flat" raycaster="objects: .trigger" rotation="" scale="" visible=""> <a-animation begin="click" easing="ease-in" attribute="scale" fill="forwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation> <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale" fill="backwards" from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation> </a-entity> </a-entity>

创建一个带有类＆＃34;触发＆＃34;。

的实体

<a-entity class="tigger" id="clip01" clip01="on: click; conditionId: ShowClipTrigger" data-is-trigger="true" geometry="primitive: plane; width: 2; height: 3" material=" src: #clip01-pic; opacity: 0.99;" position="-5.913 -3.544 4.675" rotation="-82.048 122.222 11.345" scale="" visible="" animation__move="" animation__rotate=""></a-entity>

＆＃34; .trigger＆＃34;在收到点击事件后，对象将触发一些操作。我的问题是如何在单击触发器后禁用相交。我尝试删除课程＆＃34;触发＆＃34;从点击evnet后的对象，但它仍然可以与光标相交。

我搜索a-frame文档raycaster，但没有任何线索。

Answer 1

删除列入白名单的课程后，您需要刷新raycaster：

var raycasterEl = AFRAME.scenes[0].querySelector('[raycaster]');
raycasterEl.components.raycaster.refreshObjects();

此外，您可以通过在事件侦听器中进行简单的切换来实现此目的：

 var switch=true;
 el.addEventListener("click", function(evt) {
    if(switch){
      //doStuff
      switch = false;
    }
 });

或完全删除侦听器，就像我here：

一样

//listener
this.doStuff = this.doStuff.bind(this);
el.addEventListener("click", this.doStuff());
//function
doStuff: function(){
this.el.removeEventListener("click",this.doStuff);
}

（A-Frame）如何阻止物体与光标相交？

1 个答案: