A simple physics-based collision simulator built with React. This project demonstrates the motion of two square boxes on a 1D plane, their collisions with each other, and their interactions with the walls. The simulation is based on fundamental physics equations such as conservation of momentum and elastic collisions.
- Box-to-box collisions using conservation of momentum and elastic collision formulas.
- Wall collisions simulated by reversing velocity (perfectly elastic).
- Real-time animation with adjustable velocity and mass values.
- User controls for play/pause and editing simulation parameters.
The position of a body is calculated as:
X = v * t + x
Where:
x= initial positionX= final positionv= velocityt= elapsed time
For two equal-sized square boxes:
X2 - X1 = W
X1,X2= positions of centersW = 2w(wherewis half the width of each box)
Expanding with velocity:
(x2 + v2 * t) - (x1 + v1 * t) = W
(x2 - x1) + (v2 - v1) * t = W
t = (W - (x2 - x1)) / (v2 - v1)
m1 * v1 + m2 * v2 = m1 * V1 + m2 * V2
Where:
m= massv= initial velocityV= final velocity
(v1 - v2) = - (V1 - V2)
This ensures approach speed = separation speed.
Final derived velocities:
V2 = (2*m1*v1 + m2*v2 - m1*v2) / (m1 + m2)
V1 = V2 - v1 + v2
A wall is treated as a body with infinite mass and zero velocity. Instead of fully simulating, the velocity is simply reversed:
V1 = -v1
-
Clone the repo:
git clone https://github.com/Hrithwin123/Collision-Simulator.git cd Collision-Simulator -
Install dependencies:
npm install
-
Run the development server:
npm run dev
- Click Play to start the simulation.
- Adjust velocity and mass values for each box.
- Click Apply Values to update parameters during simulation.
- Observe collisions and wall bounces in real time.
- Elastic collisions: Wikipedia
- Conservation of momentum
- Basic kinematics equations