乱数を使って描いてみよう

線を引く

code:C01.js

function setup() {

createCanvas(400, 400);

}

function draw() {

background(50,50,200);

stroke(200,200,0);

strokeWeight(3);

for(i = 20; i <= 380; i = i+10){

line(i, 100, i, 200);

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

ランダムで線を引く

code:C02.js

function setup() {

createCanvas(400, 400);

}

function draw() {

background(50,50,200);

stroke(200,200,0);

strokeWeight(3);

randomSeed(0);

for(i = 20; i <= 380; i = i+10){

let r = random(100,300);

line(i, r, i, 200);

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

ガウス分布で線を引く

code:C03.js

function setup() {

createCanvas(400, 400);

}

function draw() {

background(50,50,200);

stroke(200,200,0);

strokeWeight(3);

randomSeed(0);

for(i = 20; i <= 380; i = i+10){

let r = randomGaussian(200,100);

line(i, r, i, 200);

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

ノイズで線を引く

code:C04.js

let v = 0;

let inc = 0.1;

function setup() {

createCanvas(400, 400);

}

function draw() {

background(50,50,200);

stroke(200,200,0);

strokeWeight(3);

noLoop();

for(i = 20; i <= 380; i = i+10){

let n = noise(v) * 200;

line(i, n, i, 200+n);

v = v + inc;

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

乱数と三角関数の組み合わせ1

code:C05.js

let radius = 10;

let centx = 200;

let centy = 200;

function setup() {

createCanvas(400, 400);

smooth();

noLoop();

}

function draw() {

background(255, 100, 100);

stroke(255);

strokeWeight(3);

let x, y;

let lastx = -999;

let lasty = -999;

for (let ang = 0; ang <= 360 * 6 ; ang +=5){

radius = radius + 0.4;

let rad = radians(ang);

x = centx + (radius * cos(rad));

y = centy + (radius * sin(rad));

if(lastx > -999){

line(x, y, lastx, lasty);

}

lastx = x;

lasty = y;

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

乱数と三角関数の組み合わせ2

code:C06.js

let radius = 10;

let centx = 200;

let centy = 200;

function setup() {

createCanvas(400, 400);

smooth();

noLoop();

}

function draw() {

background(255, 100, 100);

stroke(255);

strokeWeight(3);

let x, y;

let lastx = -999;

let lasty = -999;

for (let ang = 0; ang <= 360 * 6 ; ang +=5){

radius = radius + 0.4;

let rad = radians(ang);

x = centx + ((radius +random(30)) * cos(rad));

y = centy + ((radius + random(30)) * sin(rad));

if(lastx > -999){

line(x, y, lastx, lasty);

}

lastx = x;

lasty = y;

}

}

function keyPressed(){

if (key == 's') {

saveCanvas('isd_practiceC', 'png');

}

}

https://gyazo.com/0c7aff974d0b99114c11f45120e8beec