xxxxxxxxxx
68
let glyphs = ["@", "#", "*", "+", ":", ".", " "]; // Been really intrested in glyphs lately, so I wanted to use them for dithering
let numPoints = 3000; // Total points in spiral, provides texture
let numTurns = 20; // Number of spiral turns
let particles = [];
function setup() {
createCanvas(600, 600);
background(0);
textFont("monospace");
textAlign(CENTER, CENTER);
// Initialize spiral particles
for (let i = 0; i < numPoints; i++) {
let angle = map(i, 0, numPoints, 0, TWO_PI * numTurns);
let radius = map(i, 0, numPoints, 5, width / 2);
let x = radius * cos(angle) + width / 2;
let y = radius * sin(angle) + height / 2;
let ditherIndex = floor(map(radius, 0, width / 2, 0, glyphs.length));
ditherIndex = constrain(ditherIndex, 0, glyphs.length - 1);
let glyph = glyphs[ditherIndex];
particles.push(new Particle(x, y, glyph, radius, angle));
}
}
function draw() {
background(0, 25.5); // Slight fade effect for trails to give it a 3D feel
for (let p of particles) {
let wind = createVector(map(p.pos.x, 0, width, -0.02, 0.02), 0.03); // Wind force
p.applyForce(wind);
p.update();
p.display();
}
}
// Particle class with physics. Refrenced a LLM for the remainig code of this section
class Particle {
constructor(x, y, glyph, radius, angle) {
this.pos = createVector(x, y);
this.vel = createVector(0, 0);
this.acc = createVector(0, 0);
this.glyph = glyph;
this.radius = radius;
this.angle = angle;
}
applyForce(force) {
this.acc.add(force);
}
update() {
this.vel.add(this.acc);
this.pos.add(this.vel);
this.acc.mult(0); // Reset acceleration each frame
}
display() {
fill(255);
let size = map(this.radius, 0, width / 2, 12, 4);
textSize(size);
text(this.glyph, this.pos.x, this.pos.y);
}
}