Arc vs. Bezier Curve

When my students learn Adobe Illustrator, they must use the pen tool to trace various shapes such as a circle or a letter that has curved portions. It is mathematically impossible to create a bezier curve that exactly traces a circle or even a portion of a circle. But you can create a close approximation of a small piece like a quarter circle. The fidelity of your approximation depends on how large you plan to make the circle. Small differences will become more apparent if the circle is large or if you magnify the drawing. It is easy to mask the difference by keeping the circle small or making the strokes wide.

See if you can make the red arc disappear by configuring the blue bezier curve precisely on top of it. The radius is 500 pixels. What proportion of the radius do the control points need to have? Can you succeed with one-third circle or one-half circle? When drawing in Adobe Illustrator, it may be difficult to drag the control points exactly where you need to. Using SVG instead, we can precisely place the control points using a mathematical formula. Note that we must move the control points symmetrically: when we move one point in, the other point must also move in, and vice versa.

Red = circle arc Blue = Bezier curve Green = Control points Red = circle arc Blue = Bezier curve Green = Control points Red = circle arc Blue = Bezier curve Green = Control points Red = circle arc Blue = Bezier curve Green = Control points

250