Skip to content

Voxel3DRenderer

Renders volumetric data as a grid of interactive 3D blocks.

Constructor

typescript
const renderer = new Voxel3DRenderer(options: Voxel3DRendererOptions);

Options

PropertyTypeDefaultDescription
canvasHTMLCanvasElementRequiredThe target canvas element.
voxelSizenumber1.0Size of each voxel cube.
thresholdnumber0.0Visibility cutoff (0.0 to 1.0).
opacitynumber0.9Global transparency.

Methods

setData(data: VoxelData): void

Sets the voxel positions and intensities.

updateThreshold(value: number): void

Updates the GPU threshold immediately. Useful for "peeling" volumetric layers.

updateVoxelSize(size: number): void

Global scale for individual voxels.

Interfaces

VoxelData

typescript
interface VoxelData {
  positions: Float32Array; // [x, y, z] centers
  values: Float32Array;    // Intensity [0-1] for each voxel
}

Lighting

Includes a built-in Lambertian lighting model in the fragment shader to provide realistic shading and depth to the volume.

Known limitations

  • Bundle entry — pick velo-plot, velo-plot/trading, velo-plot/scientific, or velo-plot/full. See Bundle Architecture.
  • WebGPU renderer (renderer: 'webgpu') requires an extended bundle entry and is experimental — use WebGL (default) for production.
  • SVGexportSVG() and renderer: 'svg' require an extended bundle. LaTeX labels and contour overlays are partial; 3D is not supported in SVG. See SVG examples.
  • See Plugin status registry for plugin maturity (complete, partial, experimental).

Released under the MIT License.