Written in TypeScript, uses three.js and ammo.js, brings physics to your three.js project and the third dimension to your Phaser 3 game.
Visit the enable3d website for documentation and examples.
enable3d now targets es2015+. If you use TypeScript or Babel, set your target to es2015 (es6) or higher.
Since three.js r118, it is hard (impossible) to share the WebGL context with Phaser. Enable3d will therefore create a second canvas for 3d elements. It does this automatically. You do not have to make any changes manually.
If you are using the Phaser 3D Extension, you have to add { transparent: true } to the Phaser game config and remove backgroundColor (if present).
const config = {
type: Phaser.WEBGL,
transparent: true,
scale: {
mode: Phaser.Scale.FIT,
autoCenter: Phaser.Scale.CENTER_BOTH,
width: 1280,
height: 720
},
scene: [MainScene],
...Canvas()
}This project is split into many separate npm packages. To better understand the structure and relationships between the packages, see the diagram.
- enable3d A standalone 3D Framework on top of three-graphics.
- @enable3d/phaser-extension Allows to integrate the three-graphics package into your Phaser 3 Games.
- @enable3d/ammo-physics The core Physics package. Wraps ammo.js physics.
- @enable3d/ammo-on-nodejs Enables you to run ammo.js on your node.js server.
- @enable3d/three-graphics The core 3D Objects package. A beautiful API for many three.js elements.
- @enable3d/three-wrapper Wraps the three.js library and some of its examples in one package.
- @enable3d/common Some common code used by almost every package.
Want to make a Real-Time Multiplayer Game? Check out geckos.io.
The GNU General Public License v3.0 (GNU GPLv3) 2019 - Yannick Deubel. Please have a look at the LICENSE for more details.