Reference quadraticVertex()

quadraticVertex()

Adds a quadratic Bézier curve segment to a custom shape.

quadraticVertex() adds a curved segment to custom shapes. The Bézier curve segments it creates are similar to those made by the bezierVertex() function. quadraticVertex() must be called between the beginShape() and endShape() functions. The curved segment uses the previous vertex as the first anchor point, so there must be at least one call to vertex() before quadraticVertex() can be used.

The first two parameters, cx and cy, set the curve’s control point. The control point "pulls" the curve towards its.

The last two parameters, x3, and y3, set the last anchor point. The last anchor point is where the curve ends.

Bézier curves can also be drawn in 3D using WebGL mode. The 3D version of bezierVertex() has eight arguments because each point has x-, y-, and z-coordinates.

Note: quadraticVertex() won’t work when an argument is passed to beginShape().

Examples

Syntax

quadraticVertex(cx, cy, x3, y3)
quadraticVertex(cx, cy, cz, x3, y3, z3)

Parameters

cx
Number:

x-coordinate of the control point.

cy
Number:

y-coordinate of the control point.

x3
Number:

x-coordinate of the anchor point.

y3
Number:

y-coordinate of the anchor point.

cz
Number:

z-coordinate of the control point.

z3
Number:

z-coordinate of the anchor point.

Notice any errors or typos? Please let us know. Please feel free to edit src/core/shape/vertex.js and open a pull request!

Related References