p5.js 覚え書き

 function setup() {
  alert("Hello World!!");
  createCanvas(600,200); // キャンバス（描画エリア）の作成
  background(255, 127, 127);　// キャンバス（背景）の色 R, G, B
  noStroke();
 }
 
 function draw() {
   console.log("hello world");
   let s = 'hello world. ハローワールド';
   fill(0,0,127); // 文字列の色 R, G, B
   textSize(40); // 文字の大きさ（サイズ）
   text(s, 5, 5, width - 5, height - 5 );   
 }

function setup(){
  createElement('h2', 'ランダムに円を描く');
  createCanvas(600,600);
  background(255);
  noStroke();
}
function draw(){
  //オブジェクトの色をランダム（透明度70）
  fill(random(255),random(255),random(255),70);
  circle(random(width),random(height),random(100));
}

const sketch = p => {
  p.setup = () => {
    p.createElement('h2', 'ランダムに円を描く');
    p.createCanvas(600,600);
    p.background(255);
    p.noStroke();
　}
　p.draw = () => {
    //オブジェクトの色をランダム（透明度70）
    p.fill(p.random(255),p.random(255),p.random(255),70);
    p.circle(p.random(p.width),p.random(p.height),p.random(100));
  }  
}
new p5(sketch, 'id');