O'Reilly logo

Learning Raphaël JS Vector Graphics by Damian Dawber

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Drawing curves

There are three types of curve path: quadratic Bézier curves, cubic Bézier curves, and arcs. Bézier curves are curves defined between a start and end point but whose direction we can determine by using control points, while arcs are a portion of the circumference of an ellipse.

Quadratic Bézier curves

A quadratic Bézier curve is a curve between two points with a single control point. To appreciate how quadratic Bézier curves are drawn, you should experiment with the animated demo at http://www.jasondavies.com/animated-bezier/. As shown here, the curve is drawn from a point P0 to a point P2 with a control point P1. The control point P1 relative to P0 and P2 determines the extent to which the curve bends: from start to finish, the ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required