@cocos/cannon
@cocos/cannon
npm i @cocos/cannon
@cocos/cannon

@cocos/cannon

A lightweight 3D physics engine written in JavaScript.

by cocos

1.2.8 (see all)TypeScript:Not Found
npm i @cocos/cannon
Readme

cannon.js for cocos creator

Lightweight 3D physics for the web

Inspired by three.js and ammo.js, and driven by the fact that the web lacks a physics engine, here comes cannon.js. The rigid body physics engine includes simple collision detection, various body shapes, contacts, friction and constraints.

Demos - Documentation - Rendering hints - NPM package - CDN

Browser install

Just include cannon.js or cannon.min.js in your html and you're done:

<script src="cannon.min.js"></script>

Node.js install

Install via npm for cocos creator:

usage : npm install @cocos/cannon --save

Example

The sample code below creates a sphere on a plane, steps the simulation, and prints the sphere simulation to the console. Note that Cannon.js uses SI units (metre, kilogram, second, etc.).

// Setup our world
var world = new CANNON.World();
world.gravity.set(0, 0, -9.82); // m/s²

// Create a sphere
var radius = 1; // m
var sphereBody = new CANNON.Body({
   mass: 5, // kg
   position: new CANNON.Vec3(0, 0, 10), // m
   shape: new CANNON.Sphere(radius)
});
world.addBody(sphereBody);

// Create a plane
var groundBody = new CANNON.Body({
    mass: 0 // mass == 0 makes the body static
});
var groundShape = new CANNON.Plane();
groundBody.addShape(groundShape);
world.addBody(groundBody);

var fixedTimeStep = 1.0 / 60.0; // seconds
var maxSubSteps = 3;

// Start the simulation loop
var lastTime;
(function simloop(time){
  requestAnimationFrame(simloop);
  if(lastTime !== undefined){
     var dt = (time - lastTime) / 1000;
     world.step(fixedTimeStep, dt, maxSubSteps);
  }
  console.log("Sphere z position: " + sphereBody.position.z);
  lastTime = time;
})();

If you want to know how to use cannon.js with a rendering engine, for example Three.js, see the Examples.

Features

  • Rigid body dynamics
  • Discrete collision detection
  • Contacts, friction and restitution
  • Constraints
    • PointToPoint (a.k.a. ball/socket joint)
    • Distance
    • Hinge (with optional motor)
    • Lock
    • ConeTwist
  • Gauss-Seidel constraint solver and an island split algorithm
  • Collision filters
  • Body sleeping
  • Experimental SPH / fluid support
  • Various shapes and collision algorithms (see table below)
SpherePlaneBoxConvexParticleHeightfieldTrimesh
SphereYesYesYesYesYesYesYes
Plane--YesYesYes-Yes
Box--YesYesYesYes(todo)
Cylinder--YesYesYesYes(todo)
Convex---YesYesYes(todo)
Particle-----(todo)(todo)
Heightfield------(todo)
Trimesh-------

Todo

The simpler todos are marked with @todo in the code. Github Issues can and should also be used for todos.

Help

Create an issue if you need help.

VersionTagPublished
1.2.8
latest
2yrs ago
1.2.7-exp.1
beta
2yrs ago
No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate