week01

 size(500,500); 背景大小

background(#00C8FC); 背景顏色

fill(#94d0fc); 填充 色彩

        

rect(100,100,100,150); 四邊形

        (左上座標 x,y (100,100) , 右下座標 x,y  (100,150) )

--------------------------------------------------------------------------------------------------------------------------------

void draw(){ 每次60秒更新

  background(#00C8FC);

  fill(#0058ED);

  rect(100,100,100,150);

  

  rect(mouseX,mouseY , 100,150);

        mouse 跟隨滑鼠座標

}

-----------------------------------------------------------------------------------------------------------------------------

p5.js  變成網頁版

將程式複製到

->https://pde2js.herokuapp.com/

翻譯

再貼到p5.js程式內

-----------------------------------------------------------------------------------------------------------------------------

小畫家

void setup(){

  size(500,500);

}

void draw(){

  if(mousePressed){ 當滑鼠按下

    line(mouseX,mouseY, pmouseX,pmouseY); 畫線

  }

}

小畫家2

void setup(){

  size(500,500);

  background(#FFFFF2);

  stroke(255,0,0);

}

void draw(){

  if(mousePressed){

    line(mouseX,mouseY, pmouseX,pmouseY);

  }

}

void keyPressed(){(當按鍵按下改色)

  if(key == '1') stroke(#0058ED);

  if(key == '2') stroke(#ED0037);  

  if(key == '3') stroke(#FFDB0A);

  }

-----------------------------------------------------------------------------------------------------------------------------