Published
Edited
Jun 8, 2022
Insert cell
Insert cell
Insert cell
r3d = import('https://cdn.skypack.dev/@dimforge/rapier3d-compat')
Insert cell
r3d.init().then(() => {
// Run the simulation.
// Use the RAPIER module here.
let gravity = { x: 0.0, y: -9.81, z: 0.0 };
let world = new r3d.World(gravity);
// Create the ground
let groundColliderDesc = r3d.ColliderDesc.cuboid(10.0, 0.1, 10.0);
world.createCollider(groundColliderDesc);

// Create a dynamic rigid-body.
let rigidBodyDesc = r3d.RigidBodyDesc.dynamic()
.setTranslation(0.0, 1.0, 0.0);
let rigidBody = world.createRigidBody(rigidBodyDesc);
// Create a cuboid collider attached to the dynamic rigidBody.
let colliderDesc = r3d.ColliderDesc.cuboid(0.5, 0.5, 0.5);
let collider = world.createCollider(colliderDesc, rigidBody);

// Game loop. Replace by your own game loop system.
let gameLoop = () => {
// Set the simulation forward.
world.step();

// Get and print the rigid-body's position.
let position = rigidBody.translation();
console.log("Rigid-body position: ", position.x, position.y, position.z);
document.getElementById('output').innerHTML = `Rigid-body position: ${position.x}, ${position.y}, ${position.z}`
setTimeout(gameLoop, 16);
};
gameLoop();
});
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more