Geometric Equations

In a drawing program,

• How would you determine what object a user clicked on?
• How would you determine what the nearest object was a user clicked on?
• How would you snap a line to the nearest object?
• How do you do all of these things efficiently?

=> Geometry and geometric equations for lines, rectangles, ellipses, arcs, and curves

Different forms of equations for different uses

Implicit forms: F(x, y) = 0

i.e.: Ax + By + c = 0

Defines a half-space and can be used for determining if a point is within a region

Intersecting multiple half-spaces define polygons

Can determine distance from a line

Parametric forms: x = G(t), y = H(t)

i.e.: x = cos(t), y = sin(t)

or, x = At + B, y = Ct + D

Restricts bounds t in [0, 1]

Directly supports animation

Directly supports computing intersections

Scales up to multiple dimensions

Control points: Used to specify geometry - often accessed through "handles" in an interface

Curves

How to let user specify and modify a curve?

• Model a curve to a hand drawn squiggle
• Create a curve that connects control points

Connecting control points is more common, but how to do it?

What kind of model to use?  => polygon

What degree?

How to model?

Some common tasks

Compute the intersection between two lines.

Compute the distance from a point to a line.

Is a point inside a polygon?

Efficiency

Precompute and cache bounds

Then, only do real computation if bounds of object intersects relevant region.

Can define a rectangle around a point (a "halo"), and perform computation on halo for nearness

Geometric Transformations

How to translate, rotate, and scale points and objects?

Define homogeneous coordinates, and use affine transforms to represent coordinate systems.

Java: See java.awt.geom.AffineTransform, Graphics2D.setTransform() and others

        Graphics2D g2 = (Graphics2D) graphics;
	AffineTransform at = new AffineTransform();

        g2.setColor(Color.white);
        g2.fillRect(getX(), getY(), getWidth(), getHeight());

	g2.setColor(Color.red);
	g2.fillRect(0, 0, 20, 20);

	at.translate(100, 0);
	g2.setTransform(at);
	g2.setColor(Color.blue);
	g2.fillRect(0, 0, 20, 20);

	at.rotate(30.0 * Math.PI / 180.0);
	g2.setTransform(at);
	g2.setColor(Color.orange);
	g2.fillRect(0, 0, 20, 20);

Java: TransformDemo.java

C#: See System.Drawing.Drawing2D.Matrix, Graphics.Transform property and others

        Graphics g = e.Graphics;
	Matrix m = new Matrix();

	g.FillRectangle(redBrush, 0, 0, 20, 20);

	m.Translate(100, 0);
	g.Transform = m;
	g.FillRectangle(blueBrush, 0, 0, 20, 20);

	m.Rotate(30);
	g.Transform = m;
	g.FillRectangle(orangeBrush, 0, 0, 20, 20);

C#: transform-demo.cs

Interacting with Geometry