A simple physics simulation written in Typescript using Verlet Integration. The code is very simple at places, keep in mind this is my first physics simulation.
Everything is abstracted as much as possible under the Fiziks class
This project was built using vite
Feel free to open a pull request or raise an issue.
- 2D Particle Physics and Collisions
- Constraints and Links
- Motors
- Rigidbody Physics
cell.ts
- contains the class for simulating a single cellengine.ts
- contains the class for simulating a circular, horizontal or vertical enginelink.ts
- contains the class for simulating a single link between two cellsfiziks.ts
- contains the main physics solver and top level APIrigidBody.ts
- contains the class for connecting cells and links to form a rigidbodyutil.ts
- contains utility functions to make my life easiermain.ts
- contains a demo setup for a simple pendulum
git clone https://github.com/skudunter/fiziks
cd fiziks
npm i
npm run dev
The Fiziks
class is a physics engine that manages cells, links, rigid bodies, and engines within a 2D canvas environment. It provides methods to add various elements and update their states according to physics simulations.
Creates a new instance of the Fiziks
class.
- Parameters:
width
: The width of the canvas.height
: The height of the canvas.ctx
: The 2D rendering context of the canvas.
Adds a cell to the physics engine.
- Parameters:
cell
: An instance of theCell
class.
- Returns:
- The added
Cell
instance.
- The added
Adds a link to the physics engine.
- Parameters:
link
: An instance of theLink
class.
Adds a circular engine to the physics engine.
- Parameters:
speed
: The speed of the engine.angle
: The angle of the engine.radius
: The radius of the engine.cell
: An instance of theCell
class.
- Returns:
- The added
Engine
instance.
- The added
Adds a horizontal engine to the physics engine.
- Parameters:
speed
: The speed of the engine.angle
: The angle of the engine.radius
: The radius of the engine.cell
: An instance of theCell
class.
- Returns:
- The added
Engine
instance.
- The added
Adds a vertical engine to the physics engine.
- Parameters:
speed
: The speed of the engine.angle
: The angle of the engine.radius
: The radius of the engine.cell
: An instance of theCell
class.
- Returns:
- The added
Engine
instance.
- The added
Adds a rigid body to the physics engine.
- Parameters:
cells
: An array ofCell
instances.color
: The color of the rigid body.
- Returns:
- The added
RigidBody
instance.
- The added
Adds a square-shaped rigid body to the physics engine.
- Parameters:
x
: The x-coordinate of the top-left corner of the square.y
: The y-coordinate of the top-left corner of the square.size
: The size of the square.color
: The color of the square.
- Returns:
- The added
RigidBody
instance.
- The added
Adds a circular cell to the physics engine.
- Parameters:
x
: The x-coordinate of the circle's center.y
: The y-coordinate of the circle's center.radius
: The radius of the circle.color
: The color of the circle.
- Returns:
- The added
Cell
instance.
- The added
Adds a rectangular rigid body to the physics engine.
- Parameters:
x
: The x-coordinate of the top-left corner of the rectangle.y
: The y-coordinate of the top-left corner of the rectangle.width
: The width of the rectangle.height
: The height of the rectangle.color
: The color of the rectangle.
- Returns:
- The added
RigidBody
instance.
- The added
Updates the physics engine for a given time step.
- Parameters:
dt
: The time step for the update.
The Cell
class represents a point mass with physics properties, such as position, velocity, and mass. It includes methods to update the cell's position based on forces applied and to render the cell on a canvas.
constructor(startX: number, startY: number, radius: number, color: string, mass: number, friction: number, ctx: CanvasRenderingContext2D, unMoveable: boolean = false)
Creates a new instance of the Cell
class.
- Parameters:
startX
: The initial x-coordinate of the cell.startY
: The initial y-coordinate of the cell.radius
: The radius of the cell.color
: The color of the cell.mass
: The mass of the cell.friction
: The friction coefficient affecting the cell's movement.ctx
: The 2D rendering context of the canvas.unMoveable
(optional): A boolean indicating if the cell is immovable. Defaults tofalse
.
Renders the cell on the canvas.
Updates the cell's position based on its velocity and applied forces.
- Parameters:
dt
: The time step for the update.
Applies a force to the cell, affecting its acceleration.
- Parameters:
force
: A vector representing the force to be applied.
Returns the current position of the cell.
- Returns:
- The current position as a
vector
.
- The current position as a
Returns the radius of the cell.
- Returns:
- The radius as a
number
.
- The radius as a
Returns whether the cell is immovable.
- Returns:
- A boolean indicating if the cell is immovable.
Sets the current position of the cell. The position will not be updated if the cell is immovable.
- Parameters:
position
: Avector
representing the new position.
Sets the current position of the cell regardless of whether it is immovable.
- Parameters:
position
: Avector
representing the new position.
The Link
class represents a constraint between two Cell
instances, maintaining a specified distance (target length) between them. It includes methods to apply the constraint and render the link on a canvas.
Creates a new instance of the Link
class.
- Parameters:
node1
: The firstCell
instance connected by the link.node2
: The secondCell
instance connected by the link.targetLength
: The target length that the link tries to maintain between the two cells.ctx
: The 2D rendering context of the canvas.
- Polygons only have collisions on their points