Search code examples
augmented-realityaframear.js

Ar-js and a-frame look-controls . The object is placed with angle if adding look controls to a-entity

I'm using Ar-js based on marker (Hiro marker). Here is working example: https://codepen.io/taime/pen/QWjExPe

<a-scene embedded arjs>
    <a-marker preset="hiro">
        <a-entity look-controls position="0 -0.5 0" rotation="0 0 0" scale="1 1 1">
            <a-box position="0 0 0" rotation="0 0 0" color="#4CC3D9" shadow></a-box>
        </a-entity>
    </a-marker>
    <a-entity camera></a-entity>
</a-scene>

The object (box) is placed with angle (rotated) but it should be horizontal! Without look-controls it is horizontal... I test it on iPhone 6S! iOS 13.3.1

Is it bug? How to set it up horizontal with look-controls? (I need to rotate the object with touch gestures thats why I'm using look-controls)

p.s. The Hiro marker is here https://raw.githubusercontent.com/AR-js-org/AR.js/master/data/images/hiro.png

Solution

  • The box is fine when tested on PC/Laptop but not on Mobile. After some test, using version 1.0.0 solve the issue for now

    <script src="https://aframe.io/releases/1.0.0/aframe.min.js"></script>

    Although on my devices (xiaomi redmi note 8 pro), i can ONLY rotate the box horizontally (can't rotate vertically). But it is fine on PC/Laptop.

    Hope aframe solve this issue