Skip to content

Commit

Permalink
Add landscape green hairy grass
Browse files Browse the repository at this point in the history
anyemelody authored and anyemelody committed Nov 19, 2024

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
1 parent 42c0be3 commit 963b9fb
Showing 18 changed files with 766 additions and 0 deletions.
Binary file modified .DS_Store
Binary file not shown.
Binary file modified Images/.DS_Store
Binary file not shown.
File renamed without changes
File renamed without changes
Binary file added Images/landscape.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed Images/pick10.png
Binary file not shown.
Binary file removed Images/pick11.png
Binary file not shown.
Binary file removed Images/pick6.png
Binary file not shown.
Binary file removed Images/pick7.png
Binary file not shown.
Binary file modified src/.DS_Store
Binary file not shown.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
70 changes: 70 additions & 0 deletions src/landscape/FlowFieldParticle.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
let noiseFloat;

class FlowFieldParticle {
constructor(h, weight) {
this.pos = createVector(random(width), random(height));
this.pPos = this.pos.copy();
this.vel = createVector(0, 0);
this.acc = createVector(0, 0);
this.maxspeed = 1.5;
this.weight = weight;
this.lifeTime = int(random(300, 1000));
this.age = 0;
this.dead = false;
this.hue = h;
}

update() {
noiseFloat = noise(this.pos.x * 0.001, this.pos.y * 0.001);
this.acc.x = cos(noiseFloat * TWO_PI * noiseFloat * 8);
this.acc.y = sin(noiseFloat * TWO_PI * noiseFloat * 8);
this.vel.add(this.acc);
this.vel.limit(this.maxspeed);
this.pos.add(this.vel);
// this.acc.mult(0);
this.age++;
}

show() {
colorMode(HSB, 360, 100, 100);
let lifeRatio = this.age / this.lifeTime;
// let hue = floor(random(50, 80));
let sat = map(this.acc.x, -1, 1, 40, 100);
let bright = map(this.acc.y, -1, 1, 40, 100);

// stroke(h,s,b, (1-lifeRatio)*255);
stroke(this.hue, sat, bright, (1 - lifeRatio) * 255);
strokeWeight(lifeRatio * this.weight);
line(this.pos.x, this.pos.y, this.pPos.x, this.pPos.y);
this.updatePrev();
}

updatePrev() {
this.pPos.x = this.pos.x;
this.pPos.y = this.pos.y;
}

edges() {
if (this.age >= this.lifeTime) this.dead = true;

if (this.pos.x > width) {
this.pos.x = 0;
this.updatePrev();
}

if (this.pos.x < 0) {
this.pos.x = width;
this.updatePrev();
}
if (this.pos.y > height) {
this.pos.y = 0;
this.updatePrev();
}
if (this.pos.y < 0) {
this.pos.y = height;
this.updatePrev();
}
}
}

export default FlowFieldParticle;
56 changes: 56 additions & 0 deletions src/landscape/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import canvasSketch from "canvas-sketch";
import p5 from "p5";
import FlowFieldParticle from "./FlowFieldParticle";

new p5();
let particles = [];

const settings = {
// pixelsPerInch: 72,
// units: 'in',
// dimensions: "a1",
dimensions: [3600, 2025],
// Tell canvas-sketch we're using p5.js
p5: true,
// Turn on a render loop (it's off by default in canvas-sketch)
animate: true,
// We can specify WebGL context if we want
// context: 'webgl',
// Optional loop duration
// duration: 20,
// Enable MSAA
attributes: {
antialias: true,
},
};

export const sketch = ({ width, height }) => {
let diaParameter = 3600;
background(0);

for (let i = 0; i < Math.round(diaParameter * 3.); i++) {
let hue = floor(random(10, 120));
particles[i] = new FlowFieldParticle(hue, Math.round(diaParameter / 240));
}

// Attach events to window to receive them
// window.mouseClicked = () => {
// console.log('Mouse clicked');
// };

// Return a renderer to 'draw' the p5.js content
return ({ context, width, height, playhead }) => {
if (particles.length > 0) {
for (let i = particles.length - 1; i >= 0; i--) {
particles[i].update();
particles[i].show();
particles[i].edges();
if (particles[i].dead) {
particles.splice(i, 1);
}
}
}
};
};

canvasSketch(sketch, settings);
621 changes: 621 additions & 0 deletions src/landscape/package-lock.json

Large diffs are not rendered by default.

19 changes: 19 additions & 0 deletions src/landscape/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
{
"name": "basicflowfield",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"dependencies": {
"@ffmpeg-installer/ffmpeg": "^1.1.0",
"canvas-sketch": "^0.7.7",
"core-js": "^3.39.0",
"nice-color-palettes": "^4.0.0",
"p5": "^1.11.1"
}
}

0 comments on commit 963b9fb

Please sign in to comment.