CODEWITHSUNDEEP
htmlthree.jsaugmented-realityaframear.js
ioan
ioan

Reputation: 295

Ar.js with a-frame: user controls where the ar object appears?

I found this method to build augmented reality in browser apps, so that no installation is needed to run it. I was able to control the ar object that it draws, but not when and where it draws it

<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.5.0/aframe/build/aframe-ar.js"></script>

<body style='margin : 0px; overflow: hidden;'>
<a-scene embedded arjs='trackingMethod: best;'>
<a-anchor hit-testing-enabled='true'>
    <a-sphere position="0 0.5 0" material="opacity: 1;" color="red"></a-sphere>
</a-anchor>
<a-camera-static/>
</a-scene>
</body>

If I aim my phone camera at this image https://jeromeetienne.github.io/AR.js/data/images/HIRO.jpg it draws a sphere infront of the it.

Is there a way to make it draw the sphere where I tap on the screen, instead of in front of a specific image? Has anyone been able to find any guides on how to use this ar.js?

Upvotes: 2

Views: 2246

Answers (1)

Piotr Adam Milewski
Piotr Adam Milewski

Reputation: 14655

ar.js is marker based, as stated in the docs.

Using ar.js, you could try to move the objects on the scene by tapping on the screen, but the scene will position itself only on a marker.

Please keep in mind - the screen is a 2D plane, while you want to move an object in the 3D space - You could move it along the x and y axes, depending where you touch on the screen, but it's clearly not what you want to achieve.

You could use argon.js, but i'm not sure, if their a-frame support is still maintained.

Upvotes: 2

Related Questions