Processing Month, Day 28 - Distorted Grids

Posted on 2011-05-28 by Jan Vantomme
Tags: processing, tutorial

Today, we're going to distort the grid we made yesterday. To do this, we'll need to modify the algorithm a little bit. We need a multidimensional PVector array to keep track of the points in the grid. We'll calculate the normal points and use random() to move them away from the grid. The code below shows you how to fill the array.

for (int j = 0; j < 11; j++) {
    for (int i = 0; i < 11; i++) {
         vertices[i][j] = new PVector( i*40 + random(-10, 10),
                                       j*40 + random(-10, 10) );
    }
}

the code for drawing the grid is a little different too. We don't calculate the points while drawing in this example, we get them out of the PVector array we've set up earlier.

for (int j = 0; j < 10; j ++) {
    beginShape(QUAD_STRIP);
    for (int i = 0; i < 11; i++) {
        vertex( vertices[i][j].x, vertices[i][j].y );
        vertex( vertices[i][j+1].x, vertices[i][j+1].y );
    }
    endShape();
}