Skip to main content

Sky consists of both a large dodecahedron used to render the 3-leveled sky gradient and a CanvasBox that renders custom sky textures ( for a sky box) within the dodecahedron sky.

Example

// Create the sky texture.
const sky = new VOXELIZE.Sky();

// Load a texture and paint it to the top of the sky.
world.loader.addTexture(ExampleImage, (texture) => {
sky.paint("top", texture);
})

// Add the sky to the scene.
world.add(sky);

// Update the sky per frame.
sky.update(camera.position);

Sky

Hierarchy​

Constructors​

constructor​

• new Sky(options?): Sky

Create a new sky instance.

Parameters​

NameType
optionsPartial<SkyOptions>

Returns​

Sky

Overrides​

CanvasBox.constructor

Properties​

boxLayers​

• boxLayers: BoxLayer[] = []

The inner layers of the canvas box.

Inherited from​

CanvasBox.boxLayers


depth​

• depth: number

The depth of the canvas box.

Inherited from​

CanvasBox.depth


height​

• height: number

The height of the canvas box.

Inherited from​

CanvasBox.height


options​

• options: CanvasBoxOptions & SkyOptions

Parameters for creating a canvas box.

Overrides​

CanvasBox.options


shadingData​

• shadingData: SkyShadingCycleData[] = []


uBottomColor​

• uBottomColor: Object

The bottom color of the sky gradient. Change this by calling Sky.setBottomColor.

Type declaration​

NameType
valueColor

uMiddleColor​

• uMiddleColor: Object

The middle color of the sky gradient. Change this by calling Sky.setMiddleColor.

Type declaration​

NameType
valueColor

uSkyOffset​

• uSkyOffset: Object

Type declaration​

NameType
valuenumber

uTextureBloomIntensity​

• uTextureBloomIntensity: Object

Type declaration​

NameType
valuenumber

uTextureBloomThreshold​

• uTextureBloomThreshold: Object

Type declaration​

NameType
valuenumber

uTopColor​

• uTopColor: Object

The top color of the sky gradient. Change this by calling Sky.setTopColor.

Type declaration​

NameType
valueColor

uUnderwaterAmbient​

• uUnderwaterAmbient: Object

The ambient water color the sky gradient fades toward while the camera is submerged.

Type declaration​

NameType
valueColor

uUnderwaterFade​

• uUnderwaterFade: Object

How much of the sky gradient is replaced by the underwater ambient, driven by camera depth.

Type declaration​

NameType
valuenumber

uVoidOffset​

• uVoidOffset: Object

Type declaration​

NameType
valuenumber

width​

• width: number

The width of the canvas box.

Inherited from​

CanvasBox.width

Accessors​

boxMaterials​

• get boxMaterials(): Map<string, MeshBasicMaterial>

The first layer of the canvas box.

Returns​

Map<string, MeshBasicMaterial>

Inherited from​

CanvasBox.boxMaterials


shadowUniforms​

• get shadowUniforms(): EntityShadowUniforms

Get the shadow uniforms for this canvas box (from the first layer). Returns null if receiveShadows is false.

Returns​

EntityShadowUniforms

Inherited from​

CanvasBox.shadowUniforms


underwaterUniforms​

• get underwaterUniforms(): UnderwaterFogUniforms

Get the underwater fog uniforms for this canvas box (from the first layer). Returns null if underwaterFog is false.

Returns​

UnderwaterFogUniforms

Inherited from​

CanvasBox.underwaterUniforms

Methods​

getBottomColor​

▸ getBottomColor(): Color

Get the current bottom color of the sky gradient. This can be used as shader uniforms's value.

Returns​

Color

The current bottom color of the sky gradient.


getMiddleColor​

▸ getMiddleColor(): Color

Get the current middle color of the sky gradient. This can be used as shader uniforms's value. For instance, this can be used to set the color of the fog in the world.

Returns​

Color

The current middle color of the sky gradient.


getTopColor​

▸ getTopColor(): Color

Get the current top color of the sky gradient. This can be used as shader uniforms's value.

Returns​

Color

The current top color of the sky gradient.


paint​

▸ paint(side, art, layer?): void

Add art to the canvas(s) of this box layer.

Parameters​

NameTypeDefault valueDescription
sideBoxSides | BoxSides[]undefinedThe side(s) of the box layer to draw on.
artColor | Texture<unknown> | ArtFunctionundefinedThe art or art function to draw on the box layer's side.
layernumber0The layer to draw on.

Returns​

void

Inherited from​

CanvasBox.paint


setShadingPhases​

▸ setShadingPhases(data): void

Parameters​

NameType
dataSkyShadingCycleData[]

Returns​

void


update​

▸ update(position, time, timePerDay): void

Update the position of the sky box to the camera's x/z position, and lerp the sky gradient colors.

Parameters​

NameTypeDescription
positionVector3The new position to center the sky at.
timenumber-
timePerDaynumber-

Returns​

void