New functions

frameRate( ) 

use for() cycle to create 5 shapes

for (let i = 0; i < 5; i++) {
    ellipse(200 + sin(frameCount/10) * 20,
      100+(i*50), 40, 40);
  }

截屏2024-09-12 下午3.41.37.png

width : get the x value of canvas

height : get the y value of canvas

modulo %

11%5 = 1

Make object clickable

image.png

mousePressed means that previous object(by . ) become clickable

Create button

image.png

create a button and the object can be interact

Use overlapping computation to narrow down the distance

image.png