Search code examples
three.jsaugmented-realityaframear.js

I do not understand the "entity camera" line of code in a-frame

I am having trouble wrapping my head around how the user's video camera is involved in the AR.js/a-frame process. Specifically, this line below:

<a-entity id="camera" camera></a-entity>

is baffling me. What does it really do? When I comment it out, my webcam is still populating the scene, (Is this because of the "embedded arjs" declaration in the scene tag?) and also my 3d model does not display on top of the marker (again, when I comment that line out). I'm just trying to get a better understanding of things. Full code below:

<a-scene id="container" embedded arjs>
    <a-marker preset='custom' type='pattern' url='assets/pattern-gimmelogo2.patt'>
        <a-entity
                position="0 -1 0"
                scale="10 10 10"
                gltf-model="assets/gpaglb.glb"
                id="glb"
                animation="property: rotation; to: 0 360 0; loop: true; dur: 10000"
        ></a-entity>
    </a-marker>
    <a-entity id="camera" camera></a-entity>
</a-scene>
Solution

  • Regarding the camera, what's going on is explained in the documentation here:

    https://aframe.io/docs/1.2.0/components/camera.html#default-camera

    "If a camera is not specified, A-Frame will inject a default camera:

    <a-entity camera="active: true" look-controls wasd-controls position="0 1.6 0" data-aframe-default-camera></a-entity>

    If a camera is specified (e.g., our own <a-camera> or <a-entity camera>), then the default camera will not be added."

    I don't really understand the 2nd part of the question. Perhaps you could post a glitch showing the problem? The issue might be with the assets rather than the code you have posted.