Here is an other solution https://discourse.processing.org/t/rasterize-image-flowfield-with-noise-values-from-image/38176/4
This is for a single video (noLoop) or a video stream.
Will be simple to adopt it for pictures.
Play with videoScale form 1 … 16
And i.e.
Blockquote
strokeWeight(2); //
// Based on
// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com
// Example 16-7: Video pixelation
import processing.video.*;
// Size of each cell in the grid, ratio of window size to video size
int videoScale = 5;
// Number of columns and rows in our system
int cols, rows;
// Variable to hold onto Capture object
Capture video;
void setup() {
size(640, 480);
// Initialize columns and rows
cols = width / videoScale;
rows = height / videoScale;
// scale video capture
video = new Capture(this, cols, rows);
video.start();
}
void captureEvent(Capture video) {
// Read image from the camera
video.read();
}
void draw() {
noLoop(); // one picture, comment out for video stream
video.loadPixels();
// Begin loop for columns
for (int i = 0; i < cols; i++) {
// Begin loop for rows
for (int j = 0; j < rows; j++) {
// Where are we, pixel-wise?
int x = i * videoScale;
int y = j * videoScale;
// Looking up the appropriate color in the pixel array
color c = video.pixels[i + j * video.width];
// calculte rotation angle based on color in the pixel array
float rot = map(brightness(c), 0, 255, 0, PI);
// for each reactange in col and row
push();
// set color
stroke(c);
//Sets the style for rendering line endings.
strokeCap(ROUND);
// translate to screen position of the related video rectangle
translate(x, y);
// rotate
rotate(rot);
// draw rotated line in the coresponding rectangle
strokeWeight(2); // Thicker
line(0, 0, videoScale, videoScale);
pop();
}
}
}