天空元素上的A帧光标侦听器未触发 [英] A-Frame cursor listener on sky element not firing
问题描述
我试图将A-Frame中的一个光标侦听器附加到一个天空元素（equirectangular图像作为纹理映射到球体）。最终目标是在点击时光标与球体相交的点处获取纹理的二维坐标。不过，我目前无法获得点击事件。任何想法？
I am trying to attach a cursor listener to a sky element (equirectangular image as texture mapped to sphere) in A-Frame. The ultimate goal is to get the 2D coordinates of the texture at the point the cursor intersects with the sphere on click. However, I currently can't get the click event to fire at all. Any thoughts?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello, World! - A-Frame</title>
<meta name="description" content="Hello, World! - A-Frame">
<script src="aframe.js"></script>
<script type="text/javascript">
window.onload = function () {
AFRAME.registerComponent('cursor-listener', {
init: function () {
this.el.addEventListener('click', function () {
console.log('I was clicked!');
});
}
});
}
</script>
</head>
<body>
<a-scene>
<a-camera>
<a-cursor></a-cursor>
</a-camera>
<a-sky cursor-listener src="image.jpg"></a-sky>
</a-scene>
</body>
</html>
推荐答案
即将发行的A版 - 框架有修复，将在click事件中公开游标UV相交数据。 https://github.com/aframevr/aframe/tree/master/dist。首先，我建议抓住它。
The soon-to-be-released version of A-Frame has fixes that will expose the cursor UV intersection data in the click event. https://github.com/aframevr/aframe/tree/master/dist . First I recommend grabbing that.
天空遥远，所以您需要扩展raycaster的 maxDistance 。
The sky is far away so you need to extend the maxDistance of the raycaster.
<a-entity raycaster="maxDistance: 6000; objects: a-sky" cursor></a-entity>
https://aframe.io/docs/0.3.0/components/cursor.html#configuring-the-cursor通过raycaster组件
这篇关于天空元素上的A帧光标侦听器未触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
