Mar 2023 Tweet
Browser-based robot simulator with three.js & rapier.js
While learning more about embodied AI and robot simulation i’m building a simple simulator, based on Three.js and Rapier physics engine.
The robot model is a mobile platform with a 6DOF manipulator and a 2-finger gripper. Each part of the robot is a three.js mesh, kept in sync with the Rapier rigid body. Parts are connected into a kinematic chain with Rapier joints. Arm pose can be set by dragging the gripper with three.js TransformControls.
Surprisingly, inverse kinematics works just based on physics simulation, without the need for an additional explicit solver.
It even has advanced features like self-collision aware motion planning, example of self-collision avoidance is shown below:
Initially, I assumed that adding inverse kinematics would be the hardest part of the project, so it’s nice that it comes for free. Compared to a proper IK solver, physics based IK is less accurate, it's not optimal, and there is less control over resulting trajectories. But simplicity is still a big benefit.
Code is on github, and live demo is below.
Keyboard controls for the demo:
- WASD: move the platform
- G: open/close gripper
- T, R: translate or rotate the gripper
- Z: toggle zoom with scrolling