AR.JS使盒子变平

Question

I am using my AR.JS to display an image over the AR pattern. 我正在使用AR.JS在AR模式上显示图像。 I am wondering if it is possible to make this not a full box but instead only one side so when I move the camera up I cannot see the size and top of the box? 我想知道是否有可能将它做成一个不完整的盒子，而只能做成一个侧面，所以当我向上移动相机时，看不到盒子的大小和顶部吗？ I thought changing position/size would do it but that does not work. 我以为改变位置/大小可以做到这一点，但这是行不通的。 Anyone got any ideas? 任何人有任何想法吗？ Does not seem to be much info on this as most people want 3D. 似乎没有太多信息，因为大多数人都想要3D。

My code is attached: 我的代码附在：

<!-- include a-frame -->
<script src="vendor/aframe/build/aframe.min.js"></script>

<!-- include ar.js for aframe -->
<script src='../build/aframe-ar.js'></script>
<script>ARjs.Context.baseURL = '../../three.js/'</script>

<!-- start the body of your page -->
<body style='margin : 0px; overflow: hidden;'>
    <!-- add some info at the top of the page -->
    <div style='position: fixed; top: 10px; width:100%; text-align: center; z-index: 1; color:white; font-size:30px;'>
        <a>Prototype Coffee</a>
    </div>

    <!-- Define your 3d scene and enabled ar.js -->
    <a-scene embedded arjs='trackingMethod: best; debugUIEnabled: false;'>

        <!-- Create a anchor to attach your augmented reality -->
        <a-anchor hit-testing-enabled='true'>

            <!-- Add your augmented reality here -->
            <a-box position='0 1.0 0' material='side:single; src:https://.com/playground/aframe/examples/img/coffee-01.png;'>

        </a-anchor>

        <!-- Define a static camera -->
        <a-camera-static/>

    </a-scene>
</body>

Answer 1

Try using an <a-plane> instead: 尝试改用<a-plane> ：

<a-plane position='0 1.0 0' material='src:https://.com/playground/aframe/examples/img/coffee-01.png;'></a-plane>

Working codepen here . 工作码本在这里。

If you don't see the plane, it could be a matter of rotation: 如果看不到飞机，则可能是旋转问题：

AR.JS使盒子变平

问题描述

1 个解决方案

解决方案1
1 2018-06-11 14:55:30

AR.JS使盒子变平

问题描述

1 个解决方案

解决方案1 1 2018-06-11 14:55:30

解决方案1
1 2018-06-11 14:55:30