Nebo

The name 'Nebo' is a reference to the Babylonian god of wisdom and writing.

A wrapper for Babylon.js, which provides a declarative way to create 3D scenes.

It offers loading complex scenes from JSON and animating them with direct changes to the JavaScript object.

A plugin system is also available to extend the functionality of the library.

Installation

npm install nebo

Usage

See the examples folder for a complete example.

export const init = (scene: any, data: SceneData, withSync = false, flavour?: Flavour) => SceneData;

When you init a scene with nebo, you can define the scene structure in a declarative way.

import { init } from 'nebo';

// Create canvas element
const canvas = document.createElement('canvas');
document.body.appendChild(canvas);

// Initialize Babylon.js engine
const engine = new Engine(canvas, true);

// Create scene
const scene = new Scene(engine);

const proxy = init(
  scene,
  {
    meshes: {
      sphere: {
        id: 'sphere',
        type: 'sphere',
        position: [0, 0, 0],
        material: {
          id: 'sphere-mat',
          type: 'standard',
          colors: {
            emissive: [1, 0, 0],
          },
        },
        meta: {
          transition: true,
          transitionDuration: 800,
          transitionEasing: [0, 0.5, 0.5, 1],
        },
      },
    },
  },
  true,
  'playground'
);

// Run the render loop
engine.runRenderLoop(() => {
  scene.render();
});

The true power comes in the proxy you receive from the init function. It is a simple object that you can use to interact with the scene:

setInterval(() => {
  const x = Math.ceil(Math.random() * 10);
  proxy.meshes.sphere.scaling = [x, x, x];
  proxy.cameras.arc.alpha = x * 45;
}, 1000);

Plugins

Name	Description
nebo-core	Create primitive meshes.