b3d-water

Water plane with reflections, waves, and underwater fog effect.

Attributes

Attribute	Default	Description
`waterSize`	`128`	Size of the water plane
`subdivisions`	`32`	Mesh subdivisions
`twoSided`	`false`	Render both sides
`windForce`	`-5`	Wind strength
`waveHeight`	`0`	Wave amplitude
`bumpHeight`	`0.1`	Normal map bump intensity
`waterColor`	`'#0066cc'`	Water tint color
`colorBlendFactor`	`0.1`	How much color tints the water
`spherical`	`false`	Use a sphere instead of a plane

Underwater Effect

When the camera goes below the water surface, a blue fog is automatically applied. The sun (if present via b3dSun) is also dimmed based on depth.

import { b3d, b3dWater, b3dSun, b3dSkybox } from 'tosijs-3d'

document.body.append(
  b3d({},
    b3dSun({}),
    b3dSkybox({ timeOfDay: 12 }),
    b3dWater({ y: -0.2, twoSided: true, waterSize: 1024, normalMap: '/waterbump.png' })
  )
)