@polygonjs/enginedeprecated

node-based webgl 3D engine https://polygonjs.com

Usage no npm install needed!

<script type="module">
  import polygonjsEngine from 'https://cdn.skypack.dev/@polygonjs/engine';
</script>

README

Polygonjs

NPM package Dependencies Dev Dependencies Language Grade Twitter

Polygonjs is a node-based 3D Webgl engine. Try our examples.

Inside Polygonjs node-based Editor

Install: npm install polygonjs-engine or yarn add polygonjs-engine.

Or use from the CDN: https://unpkg.com/polygonjs-engine@latest/dist/all.js.

The API is designed to be very simple. Here is how you create a minimal scene with a box:

import {PolyScene} from 'polygonjs-engine/dist/src/engine/scene/PolyScene';

// create a scene
const scene = new PolyScene();

// create a box
const geo = scene.root.createNode('geo');
const box = geo.createNode('box');

// add a light
scene.root.createNode('hemisphereLight');

// create a camera
const perspectiveCamera1 = scene.root.createNode('perspectiveCamera');
perspectiveCamera1.p.t.set([5, 5, 5]);
// add OrbitControls
const events1 = perspectiveCamera1.createNode('events');
const orbitsControls = events1.createNode('cameraOrbitControls');
perspectiveCamera1.p.controls.setNode(orbitsControls);

perspectiveCamera1.createViewer(document.getElementById('app'));

Node-based

The nodes are grouped in contexts, each for a specific type of task:

  • ANIM nodes are to create animations.
  • COP nodes can import and update textures.
  • EVENT nodes are to trigger or react to events.
  • GL nodes help you create GLSL shaders.
  • MAT nodes are to create materials.
  • OBJ are to add objects to your scene.
  • POST nodes are to set up post processing.
  • ROP nodes allow you to set up the renderers.
  • SOP nodes are to manipulate geometries.

Plugins

Polygonjs is designed to be extensible. You can create your own plugins to add custom nodes. There are currently 3 official plugins:

  • Mapbox to allow to add 3D elements to Mapbox maps.
  • Occlusion to calculate occlusion on a geometry and get a nicer lighting.
  • Physics to create rigid bodies.

View the examples

Make sure to have node and yarn installed, then run yarn install and yarn start. Once the dev server has compiled the files, you can open http://localhost:8080/example and see the various examples.