Cube

Draws a box — the simplest solid — from a uniform cube to any rectangular prism, with each face independently subdividable.

Declarative element: <sk-cube>

Global: available as sk.Cube inside a scene <script>.

Remarks

This is a member of the AbstractMeshNode geometry-primitive family: a solid, renderable shape you position, paint, and animate like any scene node. It is the shape to reach for whenever you need a block, a wall panel, or a grid-ready base for deformation.

Key attributes. size sets a uniform edge length on all three axes and is animatable — a cube can pulse or grow; size-x, size-y, and size-z override it per axis to make a rectangular box. segments subdivides every face uniformly, while segments-x, segments-y, and segments-z subdivide per axis — more segments give geometry for wave or deformation effects to bend. include-quad-diagonals toggles the diagonal edges shown in wireframe: leave it off for a clean box wireframe.

Related. Give it appearance with a sk-surface-paint (fills the faces) or an sk-edge-paint (draws the wireframe), each naming a sk-plain-material. It sits alongside the other primitives — sk-sphere, sk-plane — and, like every mesh, can supply clone positions to a sk-cloner.

Constructor

constructor(config?: { size?: number; sizeX?: number; sizeY?: number; sizeZ?: number; segments?: number; segmentsX?: number; segmentsY?: number; segmentsZ?: number; includeQuadDiagonals?: boolean; cullMode?: CullMode; overlay?: boolean; overlayOccludedOpacity?: number; id?: string; x?: number; y?: number; z?: number; h?: number; p?: number; b?: number; quaternion?: Quaternion; sx?: number; sy?: number; sz?: number; s?: number; class?: string; style?: string })

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

Properties

Config Properties

Other Properties

Methods

Example

// Create a 2x2x2 cube (default)
const cube = new Cube({ id: 'my-cube' });

// Create a uniform cube with subdivisions
const uniformCube = new Cube({ id: 'uniform', size: 3, segments: 2 });

// Create a rectangular box with per-axis control
const box = new Cube({ id: 'my-box',
    sizeX: 2,
    sizeY: 4,
    sizeZ: 2,
    segmentsY: 3  // More segments on tall axis
});

Used in guides: Scene basics

↑ Documentation home · ← All classes