Skip to main content

WaterElement

WaterElement represents a dynamic water surface in the scene with customizable visual and physical properties.

Example:

const water = new WaterElement();
scene.add(water);

color: THREE.Color | string

The color of the water. Can be a THREE.Color instance or a CSS/hex color string (e.g., "#1ca3ec").

Example:

water.color = "#1ca3ec"; 

opacity: number

Opacity of the water surface, from 0 (fully transparent) to 1 (fully opaque).

Example:

water.opacity = 0.8;

tideHeight: number

Height offset of the tide, used to simulate rising and falling water levels.

Example:

water.tideHeight = 0.5;

tideScale: number

Scale factor for the tide’s visual effect.

Example:

water.tideScale = 1.2;

tideSpeed: number

Speed at which the tide effect moves or cycles.

Example:

water.tideSpeed = 0.3;

waveHeight: number

Height of the waves, controlling vertical displacement.

Example:

water.waveHeight = 0.4;

waveScale: number

Scale of the waves, controlling the size of wave patterns.

Example:

water.waveScale = 2.0;

waveSpeed: number

Speed at which the waves move across the water surface.

Example:

water.waveSpeed = 1.0;

ripplesSpeed: number

Speed of smaller ripples on the water surface.

Example:

water.ripplesSpeed = 0.5;

ripplesScale: number

Scale of the ripples, controlling how fine or coarse they appear.

Example:

water.ripplesScale = 0.8;