Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Access the camera from the canvas context via binding is returning null. #63

Open
raglandc opened this issue Jul 16, 2022 · 2 comments
Open

Comments

@raglandc
Copy link

raglandc commented Jul 16, 2022

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.

@raglandc raglandc reopened this Jul 16, 2022
@development-vargamarcel
Copy link

development-vargamarcel commented Aug 7, 2022

@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
Copy link

If you found a better solution,please let me know. thx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants