【 p5.js/Processing 】四角に角度をつけて並べる

f:id:ritocopalette:20211130020402p:plain

f:id:ritocopalette:20211130020407p:plain

code( p5.js )

function setup () {
    createCanvas(700, 700);
    noLoop();
}
// Pattern drawing
function draw(){
    background(255);
    noStroke();
    for (let y = 0; y < height; y += width/10) {
        for (let x = 0; x < width; x += width/10) {
            push();
            translate(x, y);
            myPattern();
            pop();
        }
    }
}
// rect size , position , rotate
function myPattern(){
    let a = 0.0;
    let ranA = random(900);
    let ranB = random(100);
    let inc = TWO_PI / ranA;
    stroke(2);
    scale(0.4);
    for (let i = 0; i < width/50; i++) {
        rect(i * 20, ranB, i,  sin(a)*ranA);
        rotate(PI / 3);
        a = a + inc;
    }
}

code( Processing )

void setup () {
    size(700, 700);
    noLoop();
}
void draw(){
    background(255);
    noStroke();
    for (int y = 0; y < height; y += width/10) {
        for (int x = 0; x < width; x += width/10) {
            push();
            translate(x, y);
            myPattern();
            pop();
        }
    }
}
void myPattern(){
    float a = 0.0;
    float ranA = random(900);
    float ranB = random(100);
    float inc = TWO_PI / ranA;
    stroke(2);
    scale(0.4);
    for (int i = 0; i < width/50; i++) {
        rect(i * 20, ranB, i,  sin(a)*ranA);
        rotate(PI / 3);
        a = a + inc;
    }
}