this is more of a “technical” or at least practical post.

while making the triangle properties demo, I realized that there were lots of notions involved and thought it might be useful to give away some code along with the theory. just in case you’d think there’s some magic involved.

some (most) codes are not by me, when I can remember where I found it and/or who wrote it, I usually mention it. anyway, at least Keith Peters, Keith Hair and Hristo Dachev have to be credited.

here’s a link to the source code: Basics In Generative Art ( biga.zip )
you’ll find the source code of the examples below under ./tools/ and the classes in the ./biga/ folder.

let’s get started with the Line: drag drop the handles.

quite self explanatory, check out the article about LINE for more info.

now, the Edge ( or Segment )

• the red and green perpendicular segment starting from the beginning of the segmant are the normals
• the black crosshair is projected onto the segment.
• there are 2 methods to project the point:
  • GeomUtils.project( p, a, b ) that will project on the LINE AB
  • GeomUtils.constrain( p, a, b ) that will project on the SEGMENT AB
• depending on the side of the segment on which the black crosshair lies, the stroke will turn green or red
• the blue circle is the center of the segment, we could have used the getPointAt method, the fact is that the center is pretty useful.

check the LINES 1/2 article for more info

2 edges and more

the important thing here is the intersection method and the fact that we can project a segment onto another. check JOIN THE DOTS for more info

and finally the triangle demo from the TRIANGLE article

this is obviously not the best/cleanest code ever, but at least it does the thing.
feel free to share improvements and tricks if you have any :)

next step : REGULAR POLYGONS shit… fucked it up again …
USEFUL TOOLS : CIRCLE
howdy!

Tags: basics, code, edge, generative, generative art, introduction, line, segment, source, triangle