How to Apply Torque in Planck.js?

This article provides a quick overview and practical guide on how to apply torque to a rotating rigid body within the planck.js physics engine. You will learn the specific method used to inject rotational force, understand how it differs from applying direct impulses, and see a complete code example to implement this in your 2D web games or simulations.

(Wait, the prompt says “Don’t create any horizontal rules in the article.” Let me remove that rule line)

How to Apply Torque in Planck.js?

This article provides a quick overview and practical guide on how to apply torque to a rotating rigid body within the planck.js physics engine. You will learn the specific method used to inject rotational force, understand how it differs from applying direct impulses, and see a complete code example to implement this in your 2D web games or simulations.

Understanding Torque in Planck.js

In planck.js (a JavaScript port of the Box2D physics engine), torque is a force that causes an object to rotate around its center of mass. Unlike a linear force that moves an object across X and Y coordinates, torque purely modifies the angular velocity of a Body.

To apply a continuous rotational force over time, you use the body.applyTorque(torque) method. The torque parameter is a scalar number representing the magnitude and direction of the force:

Step-by-Step Implementation

To apply torque, you must first ensure your body type is set to dynamic, as static or kinematic bodies do not respond to forces.

1. Create a Dynamic Body

const world = planck.World();
const body = world.createBody({
  type: 'dynamic',
  position: planck.Vec2(0, 0)
});

// Give the body a shape and density so it has mass
body.createFixture(planck.Box(1, 1), 1.0);

2. Apply the Torque in the Game Loop

Because forces in planck.js are cleared at the end of every physics time step, you must call applyTorque continuously inside your simulation update loop if you want a sustained rotational acceleration.

// Inside your game tick / update loop
function update() {
  const torqueMagnitude = 10.0; 
  
  // Apply counter-clockwise rotational force
  body.applyTorque(torqueMagnitude);

  // Step the physics world forward
  world.step(1 / 60);
}

Torque vs. Angular Impulse

It is crucial to distinguish between applyTorque and applyAngularImpulse: