I have some code using A-frame (https://aframe.io) that allows me to animate my camera. For some reason, whenever I add a gltf model to my existing scene with the camera animation, the code works fine exept for the camera animation which just isn't moving. I've tested the exact code for the gltf and the sky in another scene without the camera animation and it worked fine. How can I add my gltf models into my scene with a camera animation without having the weird sort of bug occur. Code with the animation: https://jsfiddle.net/AidanYoung/okeL6suf/4/ Now currently I just have a basic scene with a camera animation. How can I add the following gltf model and sky into my scene? Code for the sky and gltf:
<a-sky id="background" src="https://cdn.aframe.io/a-painter/images/sky.jpg" theta-length="90" radius="30"></a-sky>
<a-gltf-model id="1" src="https://cdn.glitch.com/daf49338-6b2c-44f1-a19d-a4880729746c%2Fscene%20-%202021-06-23T141208.785.glb?v=1624482759262" position="-0 6 -1" scale="1 1 1"></a-gltf-model>
I have attempted simply adding the sky and gltf into my scene but there is an odd glitch happening where my camera isn't moving but the gltf and sky are showing up. How can I get my camera to move with my animation but have the gltf model and sky show up in my scene? Here is my attempt of putting the together: https://jsfiddle.net/AidanYoung/Le7zq4t1/4/
Try using a camera rig (https://aframe.io/docs/1.2.0/components/camera.html):
<a-entity id="rig" position="0 1.6 0">
<a-entity id="camera" camera look-controls></a-entity>
</a-entity>
Then apply the animation to the rig:
<a-entity id="rig" position="0 1.6 0" animation="property: position; dur: 2000; easing: linear; to: 0 1.6 -100">
<a-entity id="camera" camera look-controls></a-entity>
</a-entity>