Frame Ray Caster 交点
Aframe Ray caster Intersection
切换到 Aframe 的主版本后,尽管我保留了完全相同的代码,但 raycaster 交集事件似乎变为空:
<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@efcc8a0a919811fe5bd4ab6fd60bfbb8e85a98a1/dist/aframe-master.min.js"></script>
注册组件:
AFRAME.registerComponent('collider-check', {
dependencies: ['raycaster'],
init: function () {
this.el.addEventListener('raycaster-intersected', function (evt) {
console.log(evt.detail.intersection);//this returns null
var intersection=evt.detail.intersection.point;
startTimer(intersection.x,intersection.y,intersection.z);
});
}
});
和我放置对撞机检查的相机
<a-entity id="cameraParent" position="0 0 0" >
<a-entity id="cam" camera="zoom:1;" look-controls collider-check position="0 0 0" >
<a-entity cursor=" rayOrigin: mouse"
geometry="primitive: ring; radiusInner: 0; radiusOuter: 0"
material="color: black; shader: flat"></a-entity>
<a-entity raycaster="showLine:true; far: 1000" line="color:orange; opacity:1" ></a-entity>
</a-entity>
</a-entity>
我想捕捉十字路口的天空
<a-sky class="collidable" id="image-360" radius="200" src="#{{$tour_images[0][0]->name}}" data-image-id="{{$tour_images[0][0]->id}}"></a-sky>
现在需要手动抓取路口数据,防止事件详情出现内存垃圾
事件详情为抓取路口的方法提供了方便的参考
evt.detail.getIntersection(this.el);
此外,raycaster-intersected
事件不再是垃圾邮件。它只在路口开始时被调用一次。如果你需要发送垃圾邮件,监听事件,存储一个变量,然后使用 tick
.
切换到 Aframe 的主版本后,尽管我保留了完全相同的代码,但 raycaster 交集事件似乎变为空:
<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@efcc8a0a919811fe5bd4ab6fd60bfbb8e85a98a1/dist/aframe-master.min.js"></script>
注册组件:
AFRAME.registerComponent('collider-check', {
dependencies: ['raycaster'],
init: function () {
this.el.addEventListener('raycaster-intersected', function (evt) {
console.log(evt.detail.intersection);//this returns null
var intersection=evt.detail.intersection.point;
startTimer(intersection.x,intersection.y,intersection.z);
});
}
});
和我放置对撞机检查的相机
<a-entity id="cameraParent" position="0 0 0" >
<a-entity id="cam" camera="zoom:1;" look-controls collider-check position="0 0 0" >
<a-entity cursor=" rayOrigin: mouse"
geometry="primitive: ring; radiusInner: 0; radiusOuter: 0"
material="color: black; shader: flat"></a-entity>
<a-entity raycaster="showLine:true; far: 1000" line="color:orange; opacity:1" ></a-entity>
</a-entity>
</a-entity>
我想捕捉十字路口的天空
<a-sky class="collidable" id="image-360" radius="200" src="#{{$tour_images[0][0]->name}}" data-image-id="{{$tour_images[0][0]->id}}"></a-sky>
现在需要手动抓取路口数据,防止事件详情出现内存垃圾
事件详情为抓取路口的方法提供了方便的参考
evt.detail.getIntersection(this.el);
此外,raycaster-intersected
事件不再是垃圾邮件。它只在路口开始时被调用一次。如果你需要发送垃圾邮件,监听事件,存储一个变量,然后使用 tick
.