Scene

The root of every Skenra scene — the container that every node, material, light, and camera lives inside, and the surface the scene is drawn onto.

Declarative element: <sk-scene>

Not on the sk.* global — construct via the declarative element or a module import.

Remarks

The scene is the top of the SceneNode hierarchy: it extends sk-scene-node, so it has a transform of its own, but its real job is to be the tree root everything else hangs from. Only content reachable from the scene renders. Following the scene-graph conventions, a child's transform is relative to its parent and materials inherit down the tree (a child uses an ancestor's material unless it declares its own), and DOM-style events capture/bubble through the hierarchy.

Defaults. A scene renders even when minimally specified: when no camera or light is present it supplies a sensible default camera and a default light, so a lone shape is visible without ceremony. Declare a sk-perspective-camera or sk-directional-light to take control.

Related. Everything else in this reference is something a scene contains: the geometry primitives (sk-sphere, sk-cube), grouping nodes (sk-scene-node), lights, cameras, and the materials/paints that give surfaces appearance.

Constructor

constructor(config?: { name?: string; context?: RenderContext })

Inherited from: SceneNode, SkenraAnimatable — see those pages for inherited members.

Properties

Config Properties

Other Properties

Methods

Example

// Create scene with optional configuration
const scene = new Scene({ name: 'main-scene' });

// Add surface paint to root (inherited by all children)
const material = new PlainMaterial({ baseColor: Color.yellow });
scene.addMaterialPaint(material, 'surface');

// Create and add objects to the scene
const sphere = new Sphere({ id: 'sphere', radius: 1 });
sphere.y = 2;
scene.appendChild(sphere);

const cube = new Cube({ id: 'cube', size: 1 });
cube.y = -2;
scene.appendChild(cube);

// Create hierarchy
const parent = new SceneNode({ id: 'parent' });
const child = new Sphere({ id: 'child', radius: 0.5 });
child.x = 3; // 3 units from parent
parent.appendChild(child);
scene.appendChild(parent);

// Clean up when done
scene.dispose();

Used in guides: Scene basics

↑ Documentation home · ← All classes