Render Layers

Use named render layers to place custom objects within the sky and scene draw order. This avoids scattering unexplained renderOrder values throughout an application.

Sky Pro places its own backdrops (dome, stars, cirrus, clouds) this way; you use the same layers for your content.

import { RenderLayer, placeInLayer } from "threejs-sky-pro";

placeInLayer(myGlassPanel, RenderLayer.sceneTransparent);
placeInLayer(myHudSprite, RenderLayer.foreground);

RenderLayer

Named layers in draw order. Each row draws over the rows above it.

Layer	List	Use
background	opaque	A full-screen backdrop. Nothing draws behind it.
backgroundOverlay	transparent	A blended backdrop that writes no depth.
worldSurface	opaque	A depth-writing surface under the sky (water).
atmosphereOverlay	transparent	An overlay that depth-tests against worldSurface.
sceneTransparent	transparent	Your own glass, particles, decals.
foreground	transparent	Always-on-top overlays — HUD, gizmos.

Each value is a RenderLayerSpec: { list, order }.

The list Field

Each layer belongs to either the opaque or transparent draw list. material.transparent selects an object's list, while order sorts only within that list. Opaque and transparent objects never interleave based on order alone.

placeInLayer warns when material.transparent does not match the selected layer. Correct the material setting rather than trying to compensate with renderOrder.

placeInLayer(object, layer, offset?)

Assigns object to a layer.

Param	Type	Required	Description
object	THREE.Object3D	required	The mesh (or group) to place.
layer	RenderLayerSpec	required	A member of RenderLayer.
offset	number	optional — default 0	Added to the layer's sort key to fan several meshes across one layer. A higher offset draws later (on top). Keep it in [0, 10) so the mesh stays inside the layer's band.

Returns: void

// Two overlays in one layer; the label draws over the marker.
placeInLayer(marker, RenderLayer.foreground, 0);
placeInLayer(label, RenderLayer.foreground, 1);

Types

RenderLayerSpec

interface RenderLayerSpec {
  readonly list: "opaque" | "transparent";
  readonly order: number;
}

RenderList

type RenderList = "opaque" | "transparent";

RenderLayerName

A union of the RenderLayer keys — "background" | "backgroundOverlay" | ....

See Also

• Scene Integration — adding your own content to the stack
• Water Pro Integration