robo-phy.js

This project explores the integration of 3D physics into a JavaScript environment.

• Cannon-es.js: Performance tests showed unsatisfactory results.
• Ammo.js: Performance tests showed satisfactory results.

Integrating a physics engine like Cannon-es.js or Ammo.js with the Three.js renderer enables 3D scenes to be rendered directly in the HTML window.

The inclusion of OrbitControls library allows for quick and efficient adjustment of variables during testing.

Motivation

The idea behind this project is to explore 3D physics solutions in JavaScript, thus allowing web integration and new technologies.
We have a strong interest in simulations for digital twins—virtual replicas of physical entities, such as objects or systems, that closely mirror their real-world counterparts. Various use cases are being considered in the context of Industry 5.0.

Requirements and Setup

• Node.js version 22.16.0 or later

Install Node.js and update with the following commands

sudo apt remove nodejs
sudo apt remove nodejs-doc
curl -sL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt install nodejs

Install libraries and dependencies

npm install

Check that the following elements are present with the following command in the VSCode terminal

npm list

Project-3d-physics

• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]

This project uses three.js as the 3D rendering engine, cannon-es.js and ammo.js as the 3D physics engines.

Project execution

To run the project, use the following command

npm run dev

To run a test, edit the index.html file in the src folder.

Project Structure of tests

The .src/Test/ folder contains all the testxxxx.js files.
The tests are independent. The robotxxxx.js file numbers are associated with their testxxxx.js file numbers.
Each robotxxxx.js file is used to create the robot's mechanical armature and display it with THREE.js.

Summary of tests

testxxxx.js	Description	Version of three	Physics Engine	IK associated Library	Robot Library	Robot type	Functional
0000	Testing the rotating cube after installing npm and three. Test performed after installing the interface. This is the freely rotating cube	0.179.1					OK
0001	3D PHYSICS - 2D SHAPE 3D physics test to see how the cannon-es.js implementation works in Three.js There is no 3D texture on the 3D sphere; it looks 2D No bounce or sliding between the sphere and the ground	0.179.1	cannon-es.js 0.20.0				OK
0002	1D PHYSICS - SIMULATION OF A CUBE + SPHERE ON A GROUND EDGE Repeating Test 1 Adding a cube and moving the sphere to the edge of the cube Not realistic because the sphere remains balanced on the edge of the ground.	0.179.1	cannon-es.js 0.20.0				OK
0003	1D PHYSICS - SPHERE WITH VERTICAL BOUNCE - 2D TEXTURE The sphere moves vertically only No movement on the horizontal axes, as if the sphere were locked on an invisible axis Not realistic	0.179.1	cannon-es.js 0.20.0				OK
0004	1D PHYSICS - SPHERE WITH VERTICAL BOUNCE - 3D TEXTURE Same test as 003 with 3D sphere texture	0.179.1	cannon-es.js 0.20.0				OK
0005	PHYSICS OF TWO SUPERIMPOSED BALLS Add the red ball and wait 2 seconds Add the blue ball Not realistic because the spheres don't slide against each other.	0.179.1	cannon-es.js 0.20.0				OK
0006	3D PHYSICS - MOVING 2 SPHERES IN 3D WITH THEIR TRAJECTORIES Moving two spheres in 3D space while maintaining their trajectory Slightly more realistic physics	0.179.1	cannon-es.js 0.20.0				OK
0007	3D PHYSICS - MOVING THE 3 SPHERES IN 3D WITH THEIR TRAJECTORIES Moving two spheres in 3D space while maintaining their trajectory Slightly more realistic physics Same demonstration as in test 006	0.179.1	cannon-es.js 0.20.0
0008	Test with the ammo.js library	0.179.1	ammo.js 0.0.10				Not functional version
0009	3D PHYSICS - MOVEMENT OF THE 3 SPHERES IN 3D WITH THEIR TRAJECTORIES - FINAL Random color of the spheres Random direction of the forces when creating the balls	0.179.1	cannon-es.js 0.20.0				OK
0010	Creation of the 3-axis robot in 3D	0.179.1	cannon-es.js 0.20.0				OK
0011	Creates a 3-axis robotic arm in a 3D environment	0.179.1	cannon-es.js 0.20.0				Test not working
0012a	3-axis robot that works with a pre-recorded sequence without the cannon-es.js LIBRARY Function to update the movement						Test not working
0012b	3-axis robot that works with a pre-recorded sequence without the cannon-es.js library	0.179.1					OK
0013a	3D simulation of a 3-axis robotic arm	0.179.1	cannon-es.js 0.20.0				The test is not working properly
0013b	Movement of the robot arm with rectangular limbs	0.179.1	cannon-es.js 0.20.0				OK
0014	Simplified test of a cube falling on the ground to understand the link between three and cannon-es	0.179.1	cannon-es.js 0.20.0				OK
0015	6-axis articulated robot	0.179.1			robot0015.js	?	OK
0016	Cartesian gantry robot	0.179.1			robot0016.js	?	OK
0017	3D simulation of an inverted SCARA robot	0.179.1			robot0017.js	Robot SCARA	OK
0018	Delta robot	0.179.1			robot0018.js	Delta robot	Not functional version
0019	4-axis palletizing robot	0.179.1		three-ik 0.1.0	robot0019.js	4 axis	Not functional version
0020	Function grab, lift, put; go forward(x,y), go backward(x,y) - Move the manipulator arm						just functions
0021	Direct Kinematics of a 3-Axis Robot with Three.js	0.179.1			robot0021.js		OK
0022	6-axis articulated robot that uses inverse kinematics (IK)	0.179.1		three-ik 0.1.0	robot0022.js	6 axis	Not functional version
0023	Articulated 6-axis robot controllable from slider in radian angles with j1 j2 j3 j4 j5 j6	0.179.1			robot0023.js	6 axis	Not functional version
0024	6-axis robot	0.179.1		three-ik 0.1.0	robot0024.js	6 axis	Not functional version
0025a	6-axis robot with integration of the "CCDIKSolver.js" library	0.179.1			robot0025.js	?	Not working
0025b	Try to display angles in the console	0.179.1		claudeAI_solverik_4_0.js			Not functional version
0026	Articulated 6-axis robot controllable from slider in radian angles with j1 j2 j3 j4 j5 j6	0.179.1		claudeAI_solverik_4_0.js	robot0023.js	6 axis	Not functional version
0027	Test fitting with the robot model axis by axis						Archive - Not working
0028	4-axis robot - Slider-driven j1 j2 j3 j4	0.179.1		claudeAI_solverik_4_0.js	robot0027a.js	4 axis	Not working
0029	Trigonometry test to create an inverse kinematic algorithm on a 4-axis robot	0.179.1					OK, the result is displayed in the web browser console.
0030	Trigonometry test to create an inverse kinematic algorithm on a 4-axis robot	0.179.1					OK, the result is displayed in the web browser console.
0031	4-axis robot - Slider-driven j1 j2 j3 j4	0.179.1		claudeAI_solverik_4_1.js	robot0027a.js	4 axis	Not functional version
0032	Trigonometry test to create an inverse kinematic algorithm on a 4-axis robot	0.179.1					OK, the result is displayed in the web browser console.
0033	Trigonometry test to create an inverse kinematic algorithm on a 4-axis robot						OK, the result is displayed in the web browser console.
0034	Trigonometry test to create an inverse kinematic algorithm on a 4-axis robot	0.179.1					OK, the result is displayed in the web browser console.
0035	Control of a 4-axis robot - Axis-by-axis method - X, Y and Z position translation	0.179.1		claudeAI_solverik_4_1.js	robot0027a.js	4 axis	Not working
0036	Animation of the robot gripper with the part attached to the gripper						Not working - simple animation function
0037	Pinch and box test - Version 0	0.179.1					Not working
0038	Pinch and box test - Version 1	0.177.0					Not working
0039	Test pinch and box - Version 2	0.179.1					Not working
0040	Test pinch and box - Version 3	0.179.1	cannon-es.js 0.20.0				Not working
0041	Test pinch and box - Version 4	0.177.0	cannon-es.js 0.20.0				OK
0042	Pinch and box test - Version 5 Simulation of a piece being gripped by a gripper with improvement --> but the cube moves to the right or left when the gripper moves up	0.177.0	cannon-es.js 0.20.0				OK, but not realistic.
0043	Testing the robot gripper	0.177.0	cannon-es.js 0.20.0				OK, but not realistic.
0044	Test Cylinder	0.177.0	cannon-es.js 0.20.0				OK, but not realistic.
0045	Test Cylinder	0.177.0	cannon-es.js 0.20.0				OK, but not realistic.
0046	Test Cylinder	0.177.0	cannon-es.js 0.20.0				OK, but not realistic.
0047	Installation test	0.179.1	ammo.js 0.0.10				OK
0048	Adaptation of "0046 - Test Cylinder CANNON.js" to ammo.js"	0.179.1	ammo.js 0.0.10				OK
0049	Adaptation of "0046 - Test Cylinder CANNON.js" to ammo.js with a modified version for a grip without "fingers" and with friction. Optimized parameters	0.179.1	ammo.js 0.0.10				OK
0050	Physics Version with a Cube instead of a cylinder.	0.179.1	ammo.js 0.0.10				OK
0051	Physics Version with a Cube instead of a cylinder. High mass of the cube. The jaws are in kinematics and the cube in dynamic !	0.179.1	ammo.js 0.0.10				OK
0052	Test identical to 0050 but with cube and clamp managed dynamically.	0.179.1	ammo.js 0.0.10				OK, requires fine adjustments

Using Libraries and Test Structure

• The robotxxxx.js files are used to build the robot's mechanical armature.

• The Inverse kinematics library converts Cartesian coordinates into angular positions, which is essential for controlling robotic arms.
  Tests were conducted using the three-ik library and the Claude AI language model, but they did not yield satisfactory results. The mySolverIK.js library was custom-designed to meet the needs of inverse kinematics. It uses a geometric method and is compatible with 4-axis robots or palletizing robots.

• Combining THREE.js with one of the 3D physics engines CANNON-ES.js or AMMO.js is used to manage object physics.
  Full exploration of CANNON-ES.js was inconclusive. See the use cases below.

Description of the main scene simulation

For a simulation in an industrial robotics context, the following elements are found in the main scene :

• The dark green conveyor : Raw material arrival
• The yellow conveyor : Scrap conveyor
• The red workstation : Allows material processing, like a stamping press or a plastic injection machine.
• The light green conveyor : Good parts exit area.
• The three cubes placed on the dark green conveyor represent the raw material.

Main Scene Project Structure

All variables are synchronized in the robotControl object.

When moving sliders in Manual Mode, the data is calculated using inverse kinematics. In the absence of a 3D physics engine, the movements are directly executed by the THREE.js renderer.

Rigging of the robot

This library allows you to create and move the robot's armature. This is the robot's mechanical armature that has been virtualized.

Inverse kinematics

The inverse kinematics library first allows you to calculate the angular positions of movements from the Cartesian positions.

This library also contains a direct kinematics function that allows you to calculate the robot's Cartesian position from the angular position. This is useful for updating the Cartesian position slider display in manual mode when moving one of the Joint sliders.

The robotics framework

The robotics framework allows the robot to run in automatic mode with the following movement functions :

• Joint Move
• Linear Move
• Circular Move
• Absolute Angle Move

It also manages all the robot's operating logic with :

• Object reference frames
• Tool reference frames
• Speeds and accelerations of robot arm movements
• Blending zones
• Calculation of offset positions relative to the tool reference frame or the object reference frame

Use cases

Cannon-es.js

Ammo.js

Moving the robot in axis-by-axis mode

Moving the robot in Cartesian mode (inverse kinematics)

Contribute

Simply open a pull request to the repository to describe your changes.

Credits

• Mickaël MERI @mi-meri
• Jonathan Rivalan (author) @JonRiv
• Rnd Team @SMILE

License

Licensed under the MIT License