Open Etilem opened 1 year ago
I tried out to start animations on my GLTF import with no luck :
<script> import * as SC from 'svelte-cubed'; import Mavic from './Mavic.svelte'; </script> <SC.Canvas antialias> <Mavic url={'/assets/scene.glb'} size={0.05} /> <SC.PerspectiveCamera fov={50} near={0.1} far={10} position={[0, 0, 5]} /> <SC.OrbitControls /> <SC.AmbientLight intensity={1} /> <SC.DirectionalLight color={0xffffff} intensity={2} position={[0, 0, 4]} /> <SC.DirectionalLight color={0xffffff} intensity={2} position={[0, 0, -4]} /> <SC.DirectionalLight color={0xffffff} intensity={2} position={[0, 4, 0]} /> <SC.DirectionalLight color={0xffffff} intensity={2} position={[0, -4, 0]} /> </SC.Canvas>
<script> import * as THREE from 'three'; import * as SC from 'svelte-cubed'; import { onMount } from 'svelte'; import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'; export let url = '/assets/scene.glb'; export let size = 1; /** * @type {import("three/examples/jsm/loaders/GLTFLoader.js").GLTF | null} */ let model; function loadGLTF() { const loader = new GLTFLoader(); return loader.loadAsync(url); } onMount(() => { loadGLTF() .then((_model) => (model = _model)) .catch((err) => { console.log(err.message); }); }); let time = 0; const clock = new THREE.Clock(); SC.onFrame(() => { let delta = clock.getDelta(); time += 1 * delta; }); </script> {#if model} <SC.Primitive object={model.scene} scale={[size, size, size]}> <SC.Animation clip={model.animations[0]} {time} /> </SC.Primitive> {/if}
it says : Uncaught (in promise) TypeError: action is undefined
what's wrong ???
I tried out to start animations on my GLTF import with no luck :
App.svelte
Mavic.svelte
it says : Uncaught (in promise) TypeError: action is undefined
what's wrong ???