svelte-babylon

Use BabylonJS like A-Frame through reactive Svelte Components.

code example

<BabylonEngine>
  <BabylonScene>
    <BabylonCamera position={new BABYLON.Vector3(0, 5, -10)} target={BABYLON.Vector3.Zero()} />
    <BabylonHemisphericLight direction={new BABYLON.Vector3(0, 1, 0)} intensity={0.7} />
    <!-- Below is two-way binding between spherePosition and position -->
    <BabylonSphere bind:position={spherePosition} options={{ diameter: 2, segments: 32 }} />
    <BabylonGround options={{ width: 6, height: 6 }} />
  </BabylonScene>
</BabylonEngine>

demo

https://svelte.dev/repl/3119711d043c4a8ba34c2931098a1e9c?version=3.37.0

development

1. $ npm i
2. $ npm run dev
3. http://localhost:3000/

sponsors

VU Events