zhao/p5js
zhao/p5js
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
赵鑫 2022-12-30 18:39:58 +08:00
parent 348c4fa06a
commit 666a097850
2 changed files with 68 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
13.画圆.html Normal file
View File

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="/css/style.css" />
<title>画圆</title>
<script src="/p5/p5.min.js"></script>
<script src="/p5/addons/p5.sound.min.js"></script>
<script src="/lib/utils.js"></script>
<script>
let o, d;
let circles = [];
function setup() {
createCanvas(600, 600);
background("#33DDFF");
drawGrid(0);
noFill();
noLoop();
}
function mousePressed() {
o = createVector(mouseX, mouseY);
}
function mouseDragged() {
let p = createVector(mouseX, mouseY);
d = p.sub(o).mag() * 2;
background("#33DDFF");
drawGrid(0);
circles.forEach((c) => {
circle(c.x, c.y, c.d);
});
circle(o.x, o.y, d);
}
function mouseReleased() {
let c = { x: o.x, y: o.y, d };
circles.push(c);
}
</script>
</head>
<body>
<main></main>
</body>
</html>

18
lib/utils.js
View File

@ -101,3 +101,21 @@ function drawRect(x, y, w, h, c = "bottom") {
} }
pop(); pop();
} }
function luoxuanxian(x, y) {
push();
noFill();
stroke("#FFDD33");
strokeWeight(4);
translate(x, y);
beginShape();
for (let θ = 0; θ < PI * 6; θ += 0.1) {
let a = 0;
let b = 2;
let r = a + b * θ;
let v = polarToCartesian(r, θ);
vertex(v.x, v.y);
}
endShape();
pop();
}