js curve animation code example

Example: js curve animation

// Get x, y position along a bezier curve with 3 points
// Input 3 vectors and a value between 0 and 1

function animateCurve (start, curve, end, t) {
const x1 = start.x + (curve.x - start.x) * t
const y1 = start.y + (curve.y - start.y) * t
const x2 = curve.x + (end.x - curve.x) * t
const y2 = curve.y + (end.y - curve.y) * t

const subPoints = [{ x: x1, y: y1 }, { x: x2, y: y2 }]

const x = subPoints[0].x + (subPoints[1].x - subPoints[0].x) * t
const y = subPoints[0].y + (subPoints[1].y - subPoints[0].y) * t

return { x, y }
}

Tags:

Misc Example