kamone-bezier.0412.pave.js

kamone-bezier.0412.pave.js

const controls = [
  [[10, 10], true], 
  [[50, 10], time < .1],
  [[10, 50], time < .25],
  [[50, 50], time > .5],
  [[10, 90], time > .6],
  [[50, 90], time > .8],
  [[90, 50], time < .7],
  [[90, 10], true],
]

stroke(polyline(...controls.map(c => c[0])), 'lightblue')

for (const [pt, isAnchor] of controls) {
  isAnchor
    ? fill(circle(pt, 2))
    : fill(circle(pt, 2), 'lightblue')
}

stroke(kamoneBezier(controls))

function kamoneBezier(controls) {
  let paths = [], points = []

  for (const [pt, isAnchor] of controls) {
    points.push(pt)
    if (isAnchor) {
      paths.push(nBezier(points))
      points = [pt]
    }
  }

  return join(paths)
}