Access the camera from the canvas context via binding is returning null.
raglandc opened this issue · 2 comments
raglandc commented
Hello, fellow cubers,
I am attempting to access the current camera of the scene via the context I receive from binding to the canvas and accessing it in the on-mount. I want to be able to get ahold of the position of the current camera.
additionally in the console => "warn: no camera is set"
I looked inside Rich's code for Canvas.svelte and when he calls set_root for const root, he sets the callback to warn this, so I know where it is coming from but I'm not sure how to set the camera and access it.
<script>
let canvas: SC.Canvas;
let locationVector: THREE.Vector3 | any; //chor: remove any when able to find point
onMount(() => {
loader.load('../../static/earth.glb', (gltf) => {
model = gltf;
});
const mapIter = canvas.$$.context.values();
mapIter.next();
const ctx = mapIter.next().value;
locationVector = ctx.camera.position;
// I have found the camera through context but it returns null
if (canvas) {
console.log(locationVector);
}
});
</script>
<section class="section-one">
<div class="three-scene">
<SC.Canvas bind:this={canvas} antialias alpha>
<SC.PerspectiveCamera position={[0, 0, 5]} />
<SC.PointLight position={[0, 7, 1]} />
<SC.AmbientLight />
{#if model}
<SC.Primitive
scale={1.2}
object={model.scene}
position={[0, -1, 0]}
rotation={[0, spin, -Math.PI * 0.15]}
/>
{/if}
</SC.Canvas>
</div>
</section>
In advance thank you.
development-vargamarcel commented
@raglandc , try something like this (just replace your if statement with this) :
if (canvas) {
console.log(locationVector);
setTimeout(() => {
locationVector = ctx.camera?.object?.position
console.log(locationVector);
console.log(JSON.stringify(locationVector)); //Here you can have the confirmation that the data is available at this point.
}, 1);
}
development-vargamarcel commented
If you found a better solution,please let me know. thx