p5.js 配列
配列の意味
code: non_array.js
let x1 = -5;
let x2 = 15;
let x3 = 30;
let x4 = 0;
let x5 = 40;
function setup() {
createCanvas(400, 400);
noStroke();
fill(200,200,100);
}
function draw() {
background(0);
x1 += 0.5;
x2 += 0.6;
x3 += 0.7;
x4 += 0.8;
x5 += 0.4;
arc(x1, 100, 30, 30, 0.52, 5.76);
arc(x2, 150, 30, 30, 0.52, 5.76);
arc(x3, 200, 30, 30, 0.52, 5.76);
arc(x4, 250, 30, 30, 0.52, 5.76);
arc(x5, 300, 30, 30, 0.52, 5.76);
}
code:array.js
const x = [];
function setup() {
createCanvas(400, 400);
noStroke();
fill(200,200,100);
for(let i = 0; i< width; i++){
}
}
function draw() {
background(0);
for (let i = 0; i < height; i++){
let y = i;
arc(xi, y, 12, 12, 0.52, 5.76); }
}
配列の応用
code: array_draw.js
let num = 60;
function setup() {
createCanvas(400, 400);
noStroke();
}
function draw() {
background(240);
for (let i = num - 1; i > 0; i--){
}
for (let i = 0; i < num; i++){
fill (i*4);
}
}
参考文献
p5.js Reference
「Processingをはじめよう 第2版」
https://gyazo.com/74c45920464b21ed641ca6d84a44bb01