メインコンテンツまでスキップ

Capsule

ライブエディター

function Canvas() {
      const geo = capsule({ radius: 0.5, height: 1, capSegments: 8, radialSegments: 16 })
      const mat = rotate3dX(iMouse.y.negate()).mul(rotate3dY(iMouse.x))
      const gl = useGL({
              isWebGL: true,
              isDepth: true,
              count: geo.count,
              vertex: vec4(mat.mul(geo.vertex), 1),
              fragment: vec4(varying(geo.normal), 1),
      })
      return <canvas ref={gl.ref} />
}
結果
Loading...

Capsule Props​

radiusThe capsule radius. Default is 1.
heightHeight of the middle cylindrical section. Default is 1.
capSegmentsNumber of curve segments for each hemispherical cap.
Minimum value is 1.
Default is 4.
radialSegmentsNumber of segmented faces around the circumference.
Minimum value is 3.
Default is 8.
heightSegmentsNumber of rows of faces along the cylindrical height.
Minimum value is 1.
Default is 1.

Capsule Mathematical Foundation​

A capsule represents a compound geometric primitive consisting of three parametrically defined sections. The mathematical foundation follows cylindrical coordinates with hemispherical terminations.

For the bottom hemisphere section where 0≤t≤π20 \leq t \leq \frac{\pi}{2}:

x=−rsin⁡(t)cos⁡(θ)y=−h2−rcos⁡(t)z=rsin⁡(t)sin⁡(θ)\begin{align} x &= -r \sin(t) \cos(\theta) \\ y &= -\frac{h}{2} - r \cos(t) \\ z &= r \sin(t) \sin(\theta) \end{align}

The cylindrical midsection maintains constant radius rr while varying height linearly:

x=−rcos⁡(θ)y=−h2+s⋅hwhere 0≤s≤1z=rsin⁡(θ)\begin{align} x &= -r \cos(\theta) \\ y &= -\frac{h}{2} + s \cdot h \quad \text{where } 0 \leq s \leq 1 \\ z &= r \sin(\theta) \end{align}

The top hemisphere section where 0≤t≤π20 \leq t \leq \frac{\pi}{2}:

x=−rcos⁡(t)cos⁡(θ)y=h2+rsin⁡(t)z=rcos⁡(t)sin⁡(θ)\begin{align} x &= -r \cos(t) \cos(\theta) \\ y &= \frac{h}{2} + r \sin(t) \\ z &= r \cos(t) \sin(\theta) \end{align}

Surface Normal Computation​

The normal vector calculation differs across the three regions. For hemispherical caps, normals point radially outward from the sphere centers. The cylindrical section maintains horizontal radial normals with zero vertical component.

Normal vectors are computed per vertex and normalized to unit length:

n⃗=n⃗raw∣n⃗raw∣\vec{n} = \frac{\vec{n}_{raw}}{|\vec{n}_{raw}|}

where n⃗raw\vec{n}_{raw} varies by geometric section.

Parametric Surface Segmentation​

The capsule generation algorithm divides the surface into discrete segments based on the input parameters. Total vertical segments equal:

numVerticalSegments=2×capSegments+heightSegments\text{numVerticalSegments} = 2 \times \text{capSegments} + \text{heightSegments}

Arc length parameterization ensures uniform texture coordinate distribution across the compound surface. The total arc length encompasses both hemispherical caps and the cylindrical section:

Ltotal=π⋅r+hL_{total} = \pi \cdot r + h

This parameterization maintains proportional spacing between vertices regardless of the height-to-radius ratio.