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

starSDF: Parametric Star Distance Field

Multi-Pointed Star Generation with Angular Precision

The starSDF function generates star-shaped distance fields with precise angular control. This function creates star polygons by dividing angular space into segments and applying alternating radius modulation to create the characteristic pointed and indented star geometry.

Mathematical Foundation

The star pattern is constructed through angular segmentation and polar transformation:

θseg=θV2π+0.5\theta_{seg} = \left\lfloor \frac{\theta \cdot V}{2\pi} \right\rfloor + 0.5 θstar=θsegV+mix(s,s,step(0.5,fract(θV/2π)))2π\theta_{star} = \frac{\theta_{seg}}{V} + \text{mix}(s, -s, \text{step}(0.5, \text{fract}(\theta \cdot V / 2\pi))) \cdot 2\pi dstar=r(cos(θstar),sin(θstar))d_{star} = |\vec{r} \cdot (\cos(\theta_{star}), \sin(\theta_{star}))|

where VV represents the number of star points and ss controls the inner scaling factor.

Function Signatures

FunctionParametersDescription
starSDF(st, V, s)vec2, int, floatFull control with custom inner scaling
starSDF(st, V)vec2, intSimplified version with default scaling

Parameters

ParameterTypeDescription
stvec22D coordinate position
VintNumber of star points (vertices)
sfloatInner scaling factor (default: 0.1)

Implementation Demonstrations

ライブエディター
const fragment = () => {
      const vertices = iTime.sin().add(3).floor().toInt()
      const scale = iTime.cos().mul(0.3).add(3)
      const dist = starSDF(uv, vertices, scale)
      const brightness = float(0.1).smoothstep(0, dist).mul(0.9)
      const color = brightness.mul(vec3(1, 0.7, 0.3))
      return vec4(color, 1)
}