logo

XO code style NPM Version Build Status Known Vulnerabilities Discord

Framework for developing 3D web apps

Showcases

You can find lots of examples at showcases.

basic/helloworld basic/model softbody/cloth3 postprocessing/basic-glitch softbody/ropes design/saturn

Why?


Features

Installation

NODE

$ npm install --save whs

WEBPACK

See WhitestormJS/test-whitestorm-webpack for more details.

Documentation

Full documentation of guides and APIs are located at here.

Usage

const world = new WHS.World({
    stats: "fps", // fps, ms, mb or false if not need.
    autoresize: "window",

    gravity: [0, -100, 0], // Physic gravity.

    camera: {
      position: {
        z: 50 // Move camera.
      }
    }
});

const sphere = new WHS.Sphere({ // Create sphere comonent.
  geometry: {
    radius: 3
  },

  mass: 10, // Mass of physics object.

  material: {
    color: 0xffffff, // White color.
    kind: 'basic' // THREE.MeshBasicMaterial
  },

  position: [0, 10, 0]
});

sphere.addTo(world);
console.log(sphere.native); // Returns THREE.Mesh of this object.

world.start(); // Start animations and physics simulation.

Playground!

playground

Contributors

Author Contributor Contributor Contributor Contributor Contributor Contributor Contributor Contributor

forthebadge

rss facebook twitter github youtube mail spotify instagram linkedin google pinterest medium