Placing points along an Arc using Geomerative Polygonizer and Processing

Adding blue points at each “point” returned by getPoints() function.

The code to produce this is:

import geomerative.*;

RShape wave;

float movement=0;
float plusminus = 5.0;
float scale = 3;

//Somwhere to store our curve points
RPoint[] points;

void setup()
{
 // From the examples we must always initialise the library using this command
 RG.init(this);
 
 //Usual Processing Jazz
 size(800 ,600);
 background(255);
 frameRate(25);
}

void draw(){
 //Blank Background each frame
 background(255);
 
 //Iterate our movement variable for animation
 movement += plusminus;
 
 //Create a new RShape each frame
 RShape wave = new RShape();
 
 //At the moment the wave object is empty, so lets add a curve:
 wave.addMoveTo(0*scale, 100*scale);
 wave.addBezierTo(0*scale, 100*scale, 50*scale, (25+movement)*scale, 100*scale, 100*scale);
 wave.addBezierTo(100*scale, 100*scale, 150*scale, (175-movement)*scale, 200*scale, 100*scale); 
 
 //Lets start to draw away from the edges
 translate(30*scale,0*scale);
 
 //Draw our wave
 noFill();
 stroke(0);
 strokeWeight(1*scale);
 wave.draw();
 
 //Add some points along the curve
 points = wave.getPoints(); 
 
 stroke(0, 90, 255); //Blue
 strokeWeight(5);
 for(int i=0; i<points.length; i++){ point(points[i].x, points[i].y); } //Draw our bezier handle lines strokeWeight(0.5*scale); line(0*scale,100*scale,50*scale,(25+movement)*scale); line(150*scale,(175-movement)*scale,200*scale,100*scale); //Finally draw our defined control points strokeWeight(5*scale); stroke(0, 255, 0); //Green point(0*scale,100*scale); stroke(0, 0, 255); //Blue point(50*scale,(25+movement)*scale); point(150*scale,(175-movement)*scale); stroke(255, 0, 0); //Red point(200*scale,100*scale); //If we are at the top of our movement, reverse the directing by //changing the plusminus variable if(movement > 150)
 {
 plusminus = -5;
 }else if( movement <= 0)
 {
 plusminus = 5;
 }

}

As the density of points returned by getPoints() is so high, it seems that the whole line is just a badly smoothed blue line. So we can prove to ourselves  this is not the case by quickly plotting half the points:

Done by adjusting the bounds of the for loop:

for(int i=0; i<points.length/2; i++){
 point(points[i].x, points[i].y);
 }

That is far too many points for our requirements, now we could look into just drawing every n-th point but the geomerative example alludes to a better way, manipulating the “Polygonizer”.

Better understanding the Geomerative “Polygonizer”

Now these values seem to be something we set in the library directly, rather than to the shape objects themselves, implying that this will cause a global change. Lets have a play and see what some of these options do.

First lets take the “UNIFORMLENGTH” setting used in the tutorial, manually defining a length of 30 and 100.

RG.setPolygonizer(RG.UNIFORMLENGTH);
RG.setPolygonizerLength(30);

The two resultant outputs are:

Here is an animation of the UNIFORMLENGTH Polygonizer with different lengths of 30 and 100.

This simple animation works well to show how the UNIFORMLENGTH mode of the polygonizer responds. As the length of the curve increases, further points are added to maintain the specified length between them.

Next a quick look at the alternative modes of:

RG.setPolygonizer(RG.UNIFORMSTEP);
RG.setPolygonizerStep(10);

and

RG.setPolygonizer(RG.ADAPTATIVE);

This animation compared the ADAPTIVE and UNIFORMSTEP modes of the polygonizer

The next post will cover using these points to place text along the curve.