Lesson 2 of 13

Geometries

Geometries

Geometry defines the shape of a 3D object — its vertices, edges, and faces. Three.js ships with many built-in geometries:

ClassDescriptionKey Parameters
BoxGeometryRectangular boxwidth, height, depth
SphereGeometryUV sphereradius, widthSegments, heightSegments
CylinderGeometryCylinder/coneradiusTop, radiusBottom, height, segments
TorusGeometryDonut/ringradius, tube, radialSegments, tubularSegments
PlaneGeometryFlat planewidth, height
ConeGeometryConeradius, height, segments
const box    = new THREE.BoxGeometry(2, 1, 1);
const sphere = new THREE.SphereGeometry(0.5, 32, 32);
const torus  = new THREE.TorusGeometry(1, 0.4, 16, 100);

Accessing Parameters

Each geometry stores its constructor arguments in .parameters:

const sphere = new THREE.SphereGeometry(2, 16, 16);
console.log(sphere.parameters.radius);         // 2
console.log(sphere.parameters.widthSegments);  // 16

Segment count controls smoothness — more segments = smoother, but more triangles.

Your Task

Implement the two functions below:

  • createSphere(radius, segments) — returns a SphereGeometry
  • createTorus(radius, tube) — returns a TorusGeometry with 16 radialSegments and 100 tubularSegments
Three.js loading...
Loading...
Click "Run" to execute your code.