CODEWITHSUNDEEP
aframe
Pukka
Pukka

Reputation: 140

A-Frame top right position in Camera

is it possible in A-Frame to stick a object in camera to the top right position (for a hud element). It works on dekstop with fix positions, but on mobile the circle is outside the viewport

<a-camera>
   <a-circle radius="1"></a-circle>
</a-camera>

Upvotes: 0

Views: 546

Answers (1)

Thomas Williams
Thomas Williams

Reputation: 862

The problem with using 3D Hud elements, by adding child geometry to the camera, is that they exist in 3D space, and will render differently on desktop vs mobile, because the camera view frustrum is a bit different.

If you want to use 3D hud elements, you could detect if the the viewer is on mobile or desktop, and then transform the hud elements to fit. You will have to adjust this, through trial and error, on your phone, and hope that it works across all phones. Here is a glitch that shows how to detect mobile, and use a simple 3D hud. https://glitch.com/~juniper-plot

The other way, which is more reliable, is to use a screen space Hud, and the best one is dat.GUI. Here is a glitch that shows basic usage of dat.GUI in Aframe. https://glitch.com/~gui-aframe

Note that you can also use standard html elements, placed before your tags, and they will render on top of your 3D canvas (rendered 3d scene), in screen space.

Upvotes: 1

Related Questions