Three.js Blocks

Home
Documentation
Examples
Tools

BoxNoFaceGeometry

@three-blocks/coreWebGPUWebGL
new BoxNoFaceGeometry()
Extends
THREE.BufferGeometry

Wireframe box geometry with explicit edge pairs for line rendering. Renders only the 12 edges of a box without any faces.

Architecture

  • 24 vertices (2 per edge) for clean LINE_SEGMENTS rendering
  • No indices - direct vertex pairs
  • Pre-computed bounds for efficient culling

Use Cases

  • Bounding box visualization
  • Debug wireframe overlays
  • Minimalist architectural elements
  • Selection indicators
Example
import { BoxNoFaceGeometry } from '@three-blocks/core';
import { LineSegments, LineBasicMaterial } from 'three/webgpu';

// Visualize a bounding box
const boxGeo = new BoxNoFaceGeometry(10, 5, 8);
const boxMat = new LineBasicMaterial({ color: 0x00ff00 });
const wireframe = new LineSegments(boxGeo, boxMat);
scene.add(wireframe);

// Animate with transform
wireframe.position.set(0, 2.5, 0);
wireframe.rotation.y = Math.PI / 4;