Skip to content

neu5/cannon-es-debugger-babylonjs

Repository files navigation

Deploy demo on GH Pages

cannon-es-debugger-babylonjs

This is a debugger for use with cannon-es and BabylonJS.

Example

https://neu5.github.io/cannon-es-debugger-babylonjs/

Installation

yarn add cannon-es-debugger-babylonjs --dev

Make sure you also have @babylonjs/core and cannon-es installed.

Usage

To make it work in your BabylonJS + cannon-es project you need these three steps:

  1. import the CannonDebugger from the installed package
import CannonDebugger from "cannon-es-debugger-babylonjs";
  1. initialise the cannonDebugger passing the scene and the physicalWorld
const cannonDebugger = new CannonDebugger(scene, physicalWorld);
  1. update the cannonDebugger inside of your render loop
engine.runRenderLoop(function () {
  // make the next step with the physicalWorld
  physicalWorld.fixedStep();
  // update debugger
  cannonDebugger.update();
  // possibly you want to update your meshses positions
  updateMeshPositions();
  // render the scene
  scene.render();
});

Credits

This is a debugger inspired by https://github.com/pmndrs/cannon-es-debugger which was adapted from the original cannon.js debugger written by Stefan Hedman @schteppe.

Development

First install all the dependencies by running

yarn

or npm install

Next create developer's build with watcher by running

yarn dev

and in another terminal window start serving the application with

yarn start

This will show you the index.html at the localhost:3000