每次发生时,我都需要捕获事件raycaster-intersected
。
我需要与检测到的第一个实体的距离来检查碰撞,但是该事件仅在raycaster第一次击中一个实体时触发。
如果raycaster仍然触摸实体,则不会触发事件。
我有下一个代码:
AFRAME.registerComponent("follow-body", {
'schema': {
entityId: {
type:'string',
default:''
}
},
init: function(){
this.pibot = document.querySelector("#" + this.data.entityId);
},
tick: function(){
let pibotPos = this.pibot.object3D.position;
let pibotRotation = this.pibot.object3D.rotation;
let el = this.el;
pibotPos.y += 0.2;
el.object3D.position.set(pibotPos.x, pibotPos.y, pibotPos.z);
el.object3D.rotation.set(pibotRotation.x, pibotRotation.y, pibotRotation.z);
el.addEventListener('raycaster-intersection', function(evt){
var e = new CustomEvent('intersection-detected', {detail: evt.detail});
this.dispatchEvent(e);
});
}
});
答案 0 :(得分:0)
如何定制这样的组件:
-raycaster-intersected
事件触发-您存储raycaster
-raycaster-intersected-cleared
-取消raycaster参考
-在tick
上,如果存在射线投射器参考,请获取相交点并进行计算。
AFRAME.registerComponent("foo", {
init: function() {
this.el.addEventListener("raycaster-intersected", evt => {
this.intersectingRaycaster = evt.detail.el.components.raycaster;
});
this.el.addEventListener("raycaster-intersected-cleared", () => {
this.intersectingRaycaster = null;
});
},
tick: function() {
if (!this.intersectingRaycaster) {
return;
}
const intersection = this.intersectingRaycaster.getIntersection(this.el);
if (intersection) {
let point = intersection.point;
// your calculations
}
}
});
在此fiddle中进行检查。