#Codevember day06: Web

いわゆる地味グラミングだけど蜘蛛の巣を張るをやってみる．中の連結をlineで引いてるけど角度計算は三角形だしbezierでできそう．

1. 0〜360度の角度のなかでランダムに角度を増やしながらrotateで回転しながら線を引く．
2. 回転しながら引かれる線Aと次の線Bの角度は出ているので点をつなぐ．
3. そのとき微妙に線の位置（角度と長さで出すときの長さ）をランダムにすると蜘蛛の糸っぽい．

//蜘蛛の巣を張るをやってみる
//中の連結をlineで引いてるけど角度計算は三角形だしbezierでできそう

let m = 15;

function setup() {
  createCanvas(400, 400);
  colorMode(HSB, 360, 100, 100, 100);
  angleMode(DEGREES);
}

function draw() {
  background(40, 50, 30);
  push();
  translate(width / 2, height / 2);
  let n = random(m / 4, m * 2); //nはランダムな角度
  for (let angle = 0; angle < 360; angle += n) {
    n = random(m / 4, m * 2);　 //nはランダムな角度を新たに生成
    let newAngle = angle + n; //次の中心から引かれる線の角度

    push();
    rotate(angle);
    stroke(0, 0, 100);
    strokeWeight(3);
    line(0, 0, 200, 0);
    pop();

    //     push();
    //     rotate(newAngle);
    //     stroke(0,0,100);
    //     strokeWeight(15);
    //     line(0,0,200,0);
    //     pop();

    let r = 0;
    while (r < 200) {

      if (random(100) < 50) {
        let r1 = random(r - 5, r + 5);
        let r2 = random(r - 5, r + 5);
        let x1 = cos(angle) * r1;
        let y1 = sin(angle) * r1;
        let x2 = cos(newAngle) * r2;
        let y2 = sin(newAngle) * r2;
        if (newAngle > 360) {
          x2 = cos(0) * r;
          y2 = sin(0) * r;
        }
        stroke(0, 0, 100);
        strokeCap(SQUARE);
        let sw_mult = map(r, 0, 200, 0.75, 1.25);
        let sw = map(n, m / 4, m * 2, 0.5, 3);
        strokeWeight(sw * sw_mult);
        line(x1, y1, x2, y2);
      }
      r += random(5, 20);
    }
  }
  push();
  noLoop();
}

function mousePressed() {
  redraw();
}