A 形 AR 的屏幕按钮

Question

我已经尝试了好几天了，我需要帮助，拜托了！我需要的是屏幕上的两个按钮，它们覆盖在触摸时做出反应的 ar 相机图片。我在相机实体内尝试了两个 a 平面，并将 cursor="rayOrigin: mouse" 添加到场景（A-Frame 0.8.0）。 cursor="rayOrigin: mouse" 挡住了aframe-ar.js 打开cam.

所以，有没有别的办法，也许通过js或html创建2个按钮来切换对象on/off？

Answer 1

基于 raycaster 的 cursor 组件可能无法在 ar.js 内工作。

如果您只需要一个与实体交互的简单按钮，只需在网站上输入 html <button>，并对点击做出反应：

<div style='position: fixed; top: 10px; width:100%; text-align: center; z-index: 1;'>
    <button>
        HIDE OBJECTS
    </button>
</div>
<a-scene>
....

JS

document.querySelector("button").addEventListener("click", (e)=> {
  // do stuff here.
})

例子here.

A 形 AR 的屏幕按钮

On-screen button for A-frame AR

html

javascript

interaction

augmented-reality

aframe