xxxxxxxxxx
50
// TODO: continue working through the pseudocode in this blog https://tylerxhobbs.com/essays/2020/flow-fields
let canvasWidth = 800;
let canvasHeight = 800;
//let left_x = canvasWidth * -0.5;
//let right_x = canvasWidth * 1.5;
//let top_y = canvasHeight * -0.5;
//let bottom_y = canvasHeight * 1.5;
//let resolution = canvasWidth * 0.01;
//let num_cols = (right_x - left_x) / resolution;
//let num_rows = (bottom_y - top_y) / resolution;
let num_cols = 80;
let num_rows = 80;
let grid = [];
function setup() {
// setup canvas
createCanvas(canvasWidth, canvasHeight);
// initialize grid
for (let row = 0; row <= num_rows; row++) {
grid.push([]);
for (let col = 0; col <= num_cols; col++) {
let angle = (row / float(num_rows)) * PI;
grid[row].push(angle);
}
}
}
// draw lines
function draw() {
background(150);
strokeWeight(2);
for (let row = 0; row <= num_rows; row++) {
for (let col = 0; col <= num_cols; col++) {
let gap = 20;
let length = 28;
line(
row * gap,
col * gap,
row * gap + cos(grid[col][row]) * length,
col * gap + sin(grid[col][row]) * length
);
grid[row][col] += 0.1;
}
}
}