Three.js Blocks

Home
Documentation
Examples
Tools

SDFVolumeHelpers

@three-blocks/coreWebGPU
module SDFVolumeHelpers

Collection of helper utilities for debugging and visualizing SDF volumes.

Overview These helpers provide visual feedback for SDF generation and sampling, which is crucial for debugging:

  • Bounds Helper: Visualizes the volume extent.
  • Point Cloud: Visualizes sampled points to verify distribution and containment.
  • Debug Grid: Visualizes the SDF values (distance field) directly using a grid of spheres.

Methods

createSDFBoundsHelper#

createSDFBoundsHelper(sdfGenerator : ComputeSDFGenerator, color : number) : THREE.Box3Helper

Creates a Box3Helper for visualizing SDF volume bounds.

Parameters
sdfGeneratorComputeSDFGenerator
SDF generator instance.
coloroptionalnumber
Helper line color.
Default is 0xffff00.
Returns
THREE.Box3Helper — Box helper for SDF bounds.

updateSDFBoundsHelper#

updateSDFBoundsHelper(helper : THREE.Box3Helper, sdfGenerator : ComputeSDFGenerator)

Updates an existing Box3Helper to match current SDF bounds.

Parameters
helperTHREE.Box3Helper
Existing Box3Helper.
sdfGeneratorComputeSDFGenerator
SDF generator instance.

createSDFPointCloudHelper#

createSDFPointCloudHelper(sampler : ComputeBVHSampler, options : Object) : Promise<THREE.Points>

Creates a point cloud visualization of sampled positions.

Parameters
samplerComputeBVHSampler
BVH sampler instance.
optionsoptionalObject
Configuration options.
  • pointSizeoptionalnumber
    Point size in pixels.
    Default is 2.
  • coloroptionalnumber
    Point color.
    Default is 0x00ffff.
Returns
Promise<THREE.Points> — Points mesh for visualization.

createSDFDebugGrid#

createSDFDebugGrid(sdfGenerator : ComputeSDFGenerator, options : Object) : THREE.Group

Creates a grid of spheres showing SDF sample locations (for debugging sampling).

Parameters
sdfGeneratorComputeSDFGenerator
SDF generator instance.
optionsoptionalObject
Configuration options.
  • gridSizeoptionalnumber
    Number of samples per axis.
    Default is 8.
  • sphereRadiusoptionalnumber
    Sphere radius.
    Default is 0.02.
  • colorFnoptionalfunction
    Custom color function: (sdfValue) => THREE.Color.
Returns
THREE.Group — Group containing sphere instances.