Bézier Curve Editor in Java

78022 Computer Graphics 2, obligatory semester project

About this project

The purpose of this project was to create a simple editor, allowing a user to edit Bézier curves over the net, in an Java applet. The curves were to be edited by creating and moving endpoints and controlpoints. Curves that shared an endpoint should be G1 continuous.

Theory and implementation

The applet draws lines between a number of points (initially 100, but this can be changed by the user) along one or more Bézier curves. These points are generated by letting a variable t run through a series of values from 0 to 1 with the specified number of steps. For each step, t is increased by t/n (where n is the number of steps). In addition the program uses a separate point calculated for t=1. This is because there may be rounding errors so that the curve does not reach its second endpoint.

For each value of t, the x and y values of the point are calculated separately based on the endpoints and control points of the curve (p1...p4), according to this formula:

q(t) = p1(1-t)3 + 3p2t(1-t)2 + 3p3t2 + p4t3

This formula is given in Foley et. al. (1990) as formula 11.29 on page 489.

The applet:

This applet should be pretty self-explanatory. If you start or end a new curve at one of the endpoints of an old one, they will join into one continous curve (G1 continuity, that is - the endpoint and the two adjoining control points are all on the same line). To start afresh simply reload this page. (You might have to hit <shift>-reload or something.)

[Bézier editor]

Source code:

(Get all the source code in one file here.)

References:

Foley, van Dam, Feiner, Hughes (1990) Computer Graphics, Principles and Practice. Second ed. Addison Wesley.