p5.js:point()
点を描く、点を打つ。
任意の座標に任意の色をセットできれば、理論上はあらゆる図形を描くことができる（らしい）。
キャンバスを用意する
sketch1.js//リサジュー図形(cos(nt),sin(mt+d))のパラメータ
const n=13
const m=12
const d=90 //
function setup() {//最初に1回だけ実行
createCanvas(600,600)
background(255)
//点や線の太さと色
strokeWeight(2)
stroke(255,127,127)
//描画準備
const maxt=5000 //繰り返し回数＝点の数
const w2=width/2
const h2=height/2 //(w2,h2)が中心
//描画 radians()は度→ラジアン変換
for (var t=0; t<360; t+=360/maxt) {
point(w2*(1+cos(radians(n*t))), h2*(1-sin(radians(m*t+d))))
// point(w2*(sin(radians(n*t))), h2*(sin(radians(m*t+d))))
}
}sketch.jsconst sketch = p => {
p.setup = () => {
//キャンバスを作成
const canvas = p.createCanvas(600,425);
canvas.id = '__P5sc__';
//背景色
p.background('#eee');
p.stroke('#aaa');
}
p.draw = () => {
if (p.mouseIsPressed) {
p.fill(0,0,0,10);
} else {
p.fill('#fff');
}
p.point(p.mouseX, p.mouseY);
}
}
new p5(sketch, 'editor');-ED225D.svg?logo=p5.js&style=for-the-badge){kind=icon}