---
# System prepended metadata

title: Untitled
tags: [111程式設計上課作品(A班) 第三周]

---

---
tags: 111程式設計上課作品(A班) 第三周
---![](https://i.imgur.com/ef4Q9tL.png)

```javascript=
function setup() {//環境設定，只執行一次
  createCanvas(windowWidth,windowHeight );//畫布的寬高為整個視窗
  background(100)//設定背景，如果是一個數字(0~255)，為灰階，0黑，255白
background(255,0,0)//RGB，三個數字(0~255)，(255,0,0)紅色
background("#faedcd")
}


function draw() {//一秒執行60次
  //background(220);
  noFill()//以下畫的元件不要充滿顏色
  //frameCount為一個計數器，每次進入draw()，frameCount就會+1
  stroke(mouseX%256,mouseY%256,100)
ellipse(200,300,100,(40*frameCount)%300)//畫一個座標在(200,100)，寬為200,高為40
ellipse(200,300,(40*frameCount)%100,100)//寬度不斷變化
// ellipse(mouseX,mouseY,100,(40*frameCount)%100)//畫一個座標在(200,100)，寬為200,高為40
// ellipse(mouseX,mouseY,(40*frameCount)%100,100)//寬度不斷變化
}

![](https://i.imgur.com/xbPYazz.png)

```
![](https://i.imgur.com/bRDDm80.gif)

```javascript=
function setup() {
  createCanvas(windowWidth,windowHeight );
  background("#faedcd")
}


function draw() {
//background(220);
nofill()
rectMode(CENTER) ;//設定方框以中心點為座標點   
ellipse(width/2,height/2,100)//畫圓，座標以圓心為座標點
rect(width/2,height/2,100)//畫方框，座標以左上為座標點
}![](https://i.imgur.com/FT1PXSf.png)

```

![](https://i.imgur.com/6uMZdBl.png)
---
```javascript=
function setup() {
  createCanvas(windowWidth,windowHeight );
  background("#faedcd")
}


function draw() {
//background(220);
nofill()
rectMode(CENTER) ;//設定方框以中心點為座標點
storkeweight(frameCount%2==0?4:1)//框線粗細，frameCount除以2求於數，當餘數=0(偶數)，線條粗細為4，否則為1
ellipse(width/2,height/2,100)//畫圓，座標以圓心為座標點
rect(width/2,height/2,20*frameCount)//畫方框，座標以左上為座標點
}