update
This commit is contained in:
parent
011d61f4e6
commit
dcb636442f
12
4.太阳公公.js
12
4.太阳公公.js
@ -1,8 +1,6 @@
|
||||
function setup() {
|
||||
createCanvas(400, 400);
|
||||
angleMode(DEGREES);
|
||||
stroke("#FFFF00");
|
||||
strokeWeight(8);
|
||||
frameRate(60);
|
||||
noCursor();
|
||||
}
|
||||
@ -10,8 +8,11 @@ function setup() {
|
||||
function draw() {
|
||||
background("skyblue");
|
||||
// 移动原点坐标
|
||||
push();
|
||||
translate(mouseX, mouseY);
|
||||
// 画阳光
|
||||
stroke("#FFFF00");
|
||||
strokeWeight(8);
|
||||
let distance = 1 + (frameCount % 30);
|
||||
for (let i = 0, n = 36; i < n; i++) {
|
||||
line(0, -50 - distance * 10, 0, -100 - distance * 10);
|
||||
@ -24,4 +25,11 @@ function draw() {
|
||||
arc(-20, 0, 20, 20, -135, -45);
|
||||
arc(20, 0, 20, 20, -135, -45);
|
||||
arc(0, 10, 40, 40, 45, 135);
|
||||
pop();
|
||||
|
||||
noStroke();
|
||||
fill(0);
|
||||
text("作品：太阳公公", 30, height - 70);
|
||||
text("作者：赵海洋爸爸", 30, height - 50);
|
||||
text("日期：2022/12/11", 30, height - 30);
|
||||
}
|
||||
|
||||
@ -21,7 +21,8 @@
|
||||
</style>
|
||||
<script src="p5/p5.min.js"></script>
|
||||
<script src="p5/addons/p5.sound.min.js"></script>
|
||||
<script src="4.太阳公公.js"></script>
|
||||
<script src="particle.js"></script>
|
||||
<script src="particle_demo.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
46
particle.js
46
particle.js
@ -8,12 +8,17 @@ class Particle {
|
||||
this.saturation = 0;
|
||||
this.brightness = 100;
|
||||
this.alpha = 1;
|
||||
this.size = 8;
|
||||
this.size = 2;
|
||||
this.lifetime = 0;
|
||||
this.endtime = 5;
|
||||
}
|
||||
|
||||
move(force) {
|
||||
if (this.position.y > 600) return;
|
||||
lifeover() {
|
||||
return this.lifetime >= this.endtime;
|
||||
}
|
||||
|
||||
update(force) {
|
||||
if (this.lifeover()) return;
|
||||
// 计算加速度
|
||||
const acceleration = createVector(0, 0);
|
||||
acceleration.add(this.gravity);
|
||||
@ -28,15 +33,10 @@ class Particle {
|
||||
// 更新速度及位置
|
||||
this.velocity.add(deltaVelocity);
|
||||
this.position.add(movement);
|
||||
const report = {
|
||||
time: this.lifetime.toFixed(3),
|
||||
height: (height - this.position.y).toFixed(3),
|
||||
velocity: this.velocity.mag().toFixed(3),
|
||||
};
|
||||
print(report);
|
||||
}
|
||||
|
||||
show() {
|
||||
if (this.lifeover()) return;
|
||||
noStroke();
|
||||
fill(this.hue, this.saturation, this.brightness, this.alpha);
|
||||
circle(this.position.x, this.position.y, this.size);
|
||||
@ -44,6 +44,30 @@ class Particle {
|
||||
}
|
||||
|
||||
class Particles {
|
||||
constructor() {}
|
||||
show() {}
|
||||
constructor(x, y, n) {
|
||||
this.particles = [];
|
||||
for (let i = 0; i < n; i++) {
|
||||
const p = new Particle(x, y);
|
||||
this.particles.push(p);
|
||||
}
|
||||
}
|
||||
|
||||
lifeover() {
|
||||
return this.particles.length === 0;
|
||||
}
|
||||
|
||||
update() {
|
||||
this.particles.forEach((p, i) => {
|
||||
if (p.lifeover()) {
|
||||
this.particles.splice(i, 1);
|
||||
} else {
|
||||
p.update();
|
||||
}
|
||||
});
|
||||
}
|
||||
show() {
|
||||
this.particles.forEach((p) => {
|
||||
p.show();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,14 +1,30 @@
|
||||
let particle;
|
||||
let particles = [];
|
||||
|
||||
function setup() {
|
||||
cursor(CROSS);
|
||||
colorMode(HSB);
|
||||
createCanvas(600, 600);
|
||||
particle = new Particle(width / 2, height / 2);
|
||||
createCanvas(700, 500);
|
||||
}
|
||||
|
||||
function draw() {
|
||||
background(64);
|
||||
particle.move();
|
||||
particle.show();
|
||||
background("rgba(0,0,0,0.05)");
|
||||
particles.forEach((ps, i) => {
|
||||
if (ps.lifeover()) {
|
||||
particles.splice(i, 1);
|
||||
} else {
|
||||
ps.update();
|
||||
ps.show();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function mouseClicked() {
|
||||
let ps = new Particles(mouseX, mouseY, 100);
|
||||
let hue = random(0, 360);
|
||||
ps.particles.forEach((p) => {
|
||||
p.hue = hue;
|
||||
p.saturation = 50;
|
||||
p.velocity = p5.Vector.random2D().mult(random(0, 30));
|
||||
});
|
||||
particles.push(ps);
|
||||
}
|
||||
|
||||
@ -17,3 +17,11 @@ function drawGrid() {
|
||||
for (let y = 0; y < height; y += 10) line(0, y, width, y);
|
||||
pop();
|
||||
}
|
||||
|
||||
function textInfo() {
|
||||
noStroke();
|
||||
fill(0);
|
||||
text("作品：太阳公公", 30, height - 70);
|
||||
text("作者：赵海洋爸爸", 30, height - 50);
|
||||
text("日期：2022/12/11", 30, height - 30);
|
||||
}
|
||||
|
||||
15
vehicle.js
15
vehicle.js
@ -104,6 +104,21 @@ class Vehicle {
|
||||
this.position.add(this.velocity);
|
||||
this.acceleration.set(0, 0);
|
||||
this.path.push(this.position.copy());
|
||||
|
||||
// this.acceleration.limit(this.maxAcceleration);
|
||||
// // 计算时间差
|
||||
// const duration = deltaTime / 1000;
|
||||
// // 计算速度及位移
|
||||
// const deltaVelocity = this.acceleration.mult(duration);
|
||||
// const averageVelocity = deltaVelocity.copy().div(2).add(this.velocity);
|
||||
// const movement = averageVelocity.mult(duration);
|
||||
// // 更新速度及位置
|
||||
// this.velocity.add(deltaVelocity);
|
||||
// this.velocity.limit(this.maxVelocity);
|
||||
// if (this.velocity.mag() > 0) this.heading = this.velocity.heading();
|
||||
// this.position.add(movement);
|
||||
// this.acceleration.set(0, 0);
|
||||
// this.path.push(this.position.copy());
|
||||
}
|
||||
|
||||
turn() {
|
||||
|
||||
@ -13,11 +13,11 @@ function setup() {
|
||||
}
|
||||
|
||||
function draw() {
|
||||
// 追逐鼠标();
|
||||
追逐鼠标();
|
||||
// 逃避鼠标();
|
||||
// 小车追逐();
|
||||
// 小车巡游();
|
||||
小车巡线();
|
||||
// 小车巡线();
|
||||
// 道路追逐();
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user