search

vatro / svelthree

Create three.js content using Svelte components.
https://svelthree.dev
MIT License
482 stars 15 forks source link

GLTF usage #12

Open vatro opened 4 years ago

vatro commented 4 years ago
davidfitzgibbon commented 3 years ago

Currently trying to bring a .glb into a scene. I'm reasonably seasoned at ThreeJS, I'm just not sure what pieces of Three logic I'm supposed to use, and what Svelthree logic I'm supposed to use. Currently trying to copy geometries, but it seems the full Three functionality isnt there to copy them.

I'm loving Svelthree though, and really want to get into it! Thanks so much for your work on the project!

vatro commented 2 years ago

Hi @davidfitzgibbon,

I just stumbled over your almost exactly one year old comment, sorry for not answering. 😬 To my excuse I was pretty off the svelthree train back in mid 2021. I don't know which version you were using, but as of today things are very different. Here's a relevant-parts-snippet from one my current GLTF test scenes that should get you started, just in case you're still interested:

<!-- App.svelte -->

<script>
...
import { LoadedGLTF } from "svelthree"
const draco_path = "../../draco/"
const duck_draco_url = "https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Duck/glTF-Draco/Duck.gltf"
...
</script>

...
<LoadedGLTF
  url={duck_draco_url}
  draco={draco_path}
  scale={[2, 2, 2]}
  pos={[0, -0.25, 1.25]}
  add
/>
...

All the best!

vatro commented 2 years ago

Current status update: the initial comment is still applicable. The LoadedGLTF component can load, add and postprocess (GLTF_afterLoaded) a GTLF model + a GLTF model can be converted into svelthree components (GLTF_utils + SvelthreeGLTF). Extensive tests of animation handling and exploration of various use cases are still a massive TODO.