Stole some sleep time this week to play with #D3+ #Svelte + #ThreeJS (using #Threlte)

I'm almost done re-creating the zoomable Circlepacking example #dataviz (originally rendered as SVG).

Now, I may have to do some performance measurements (and lot of code clean :D )

Three.js + Svelte = Threlte and Version 6 is finally stable! It comes with this amazingly slick documentation page: https://threlte.xyz/

Just look at how smooth the scroll based animation is 😋

A basic scene with interaction, animation and shadows is not even 40 lines of code 🤯

Try it out: https://stackblitz.com/run?file=src%2Fexample%2FScene.svelte

#Threlte #Svelte #SvelteJS #3D #animation

Wanted to learn some more threlte and rapier, so I continued working on my moto game.

using prismatic joints for the forks and rear suspension worked great. just needed to limit the travel and configure the force based motor of that joint. so it always tries to be at it's maximum.

I'm still having troubles with friction. when landing the bike seems to stop in it's tracks.

any suggestions on how to fix that?

https://labs.leon.id/2023-01-moto

#gamedev #threlte #rapier #threejs #moto

This weekends lab was playing around with svelte + threlte (three.js) + rapier (physics)

Generates a map from three.js Shape, then extrudes with ExtrudeGeometry.

Uses a polyline collider for simplicity.

first used a couple of cylinder colliders for the wheels, but the bike was getting stuck in the mesh, so tried switching to the ball collider and now it works much better.

the suspension could be better 😀

https://labs.leon.id/moto

#gamedev #threlte #threejs #rapier #indiegame #webdev

Do you know how many satellites are orbiting around earth? And how close they are?

Check out this #scrollytelling piece to find out: https://three-satellites.vercel.app/

Made by Stefan Reifenberg (https://stefanreifenberg.com) with #svelte and #threlte