疲れが癒される、素数の質量をもつ素粒子のゲーム。
コードをメモ帳などのテキストエディタに貼り付け、ファイル名を「index.html」として保存します。その後、保存したファイルをブラウザで開けば、コードが実行されます。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Particle Simulation</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
<style>
body { margin: 0; overflow: hidden; }
</style>
</head>
<body>
<script>
let particles = [];
const maxParticles = 100; // 最大パーティクル数
const trailDuration = 100; // 軌跡の持続時間
let gravity; // 重力ベクトルを宣言
function setup() {
createCanvas(windowWidth, windowHeight);
gravity = createVector(0, 0.1); // 重力ベクトルを定義
for (let i = 0; i < maxParticles; i++) {
let mass = getRandomPrime(); // 素数を取得
particles.push(new Particle(random(width), random(height), mass));
}
}
function draw() {
background(255, 50); // 背景を透明にして軌跡を表示
particles.forEach(p => {
p.update();
p.show();
});
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight); // ウィンドウのサイズが変更されたときにキャンバスを再サイズ
}
class Particle {
constructor(x, y, mass) {
this.position = createVector(x, y);
this.velocity = p5.Vector.random2D().mult(mass * 0.1); // 速度は質量に比例
this.mass = mass;
this.trail = [];
this.color = color(random(255), random(255), random(255)); // ランダムな色
}
update() {
this.velocity.add(gravity); // 重力を加える
this.position.add(this.velocity);
this.trail.push(this.position.copy()); // 軌跡を保存
// 軌跡の長さを制限
if (this.trail.length > trailDuration) {
this.trail.shift(); // 最古の軌跡を削除
}
// ウィンドウの端で反射
if (this.position.x < 0 || this.position.x > width) {
this.velocity.x *= -1; // X軸反射
this.position.x = constrain(this.position.x, 0, width); // 位置を制限
}
if (this.position.y < 0 || this.position.y > height) {
this.velocity.y *= -1; // Y軸反射
this.position.y = constrain(this.position.y, 0, height); // 位置を制限
}
}
show() {
// 軌跡を描画
for (let i = 0; i < this.trail.length; i++) {
let alpha = map(i, 0, this.trail.length, 0, 255);
stroke(0, alpha);
strokeWeight(2);
point(this.trail[i].x, this.trail[i].y);
}
// パーティクルを描画
fill(this.color); // ランダムな色を使用
noStroke();
ellipse(this.position.x, this.position.y, this.mass * 2, this.mass * 2); // 質量に基づくサイズ
}
}
// 素数を生成する関数
function getRandomPrime() {
let num;
do {
num = floor(random(2, 30)); // 2から30の範囲でランダムに素数を選択
} while (!isPrime(num));
return num;
}
// 素数判定関数
function isPrime(n) {
if (n <= 1) return false;
for (let i = 2; i <= sqrt(n); i++) {
if (n % i === 0) return false;
}
return true;
}
</script>
</body>
</html>