Last active
May 2, 2017 15:33
-
-
Save ianjsikes/fd0f905671916e953859640bd6f3193a to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Basic setup for a p5.js sketch | |
// This function gets called once at the start of the page load | |
function setup() { | |
// This creates an 800x800 HTML canvas element | |
createCanvas(800, 800); | |
} | |
// This function gets called ~60 times/second | |
function draw() { | |
// Paint the background white | |
background(255); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Declare a variable called planetArray | |
let planetArray; | |
function setup() { | |
createCanvas(800, 800); | |
// Initialize that variable to an empty array | |
planetArray = []; | |
} | |
function draw() { | |
background(255); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let planetArray; | |
// Make a Planet class. This will allow us to create planet objects that share certain common behaviors | |
class Planet { | |
// Create a planet by giving it a location and mass | |
constructor(x, y, mass) { | |
// Store the location as a vector (think of it as a 2D point) | |
this.location = createVector(x, y); | |
this.mass = mass; | |
} | |
// We will call this render function in draw() | |
render() { | |
// This p5.js function draws an ellipse to the screen at the given x, y, and radius | |
ellipse(this.location.x, this.location.y, this.mass); | |
} | |
} | |
function setup() { | |
createCanvas(800, 800); | |
planetArray = []; | |
} | |
function draw() { | |
background(255); | |
// Loop over each planet in the array | |
for (let i = 0; i < planetArray.length; i++) { | |
// Call the planet's render method so it will appear on the page | |
planetArray[i].render(); | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let planetArray; | |
class Planet { | |
constructor(x, y, mass) { | |
this.location = createVector(x, y); | |
this.mass = mass; | |
} | |
render() { | |
ellipse(this.location.x, this.location.y, this.mass); | |
} | |
} | |
function setup() { | |
createCanvas(800, 800); | |
planetArray = []; | |
} | |
function draw() { | |
background(255); | |
for (let i = 0; i < planetArray.length; i++) { | |
planetArray[i].render(); | |
} | |
} | |
// This p5.js function will be called every time the mouse is clicked | |
function mousePressed() { | |
// Create a new planet at the mouse's location with a random mass | |
let p = new Planet(mouseX, mouseY, random(50)); | |
// Add our new planet to the array | |
planetArray.push(p); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let planetArray; | |
class Planet { | |
constructor(x, y, mass) { | |
this.location = createVector(x, y); | |
// Create vectors for velocity and acceleration | |
this.velocity = createVector(0, 0); | |
this.acceleration = createVector(0, 0); | |
this.mass = mass; | |
} | |
// Add a force to this planet. The force will affect the planet's | |
// acceleration proportional to it's mass | |
applyForce(force) { | |
// Using the classic equation Force = Mass * Acceleration | |
// Rewrite as Acceleration = Force / Mass | |
// Add that acceleration to our planet's acceleration | |
this.acceleration.add(force.div(this.mass)); | |
} | |
render() { | |
ellipse(this.location.x, this.location.y, this.mass); | |
// Add acceleration to velocity, velocity to location | |
this.velocity.add(this.acceleration); | |
this.location.add(this.velocity); | |
this.acceleration.mult(0); | |
} | |
} | |
function setup() { | |
createCanvas(800, 800); | |
planetArray = []; | |
} | |
function draw() { | |
background(255); | |
for (let i = 0; i < planetArray.length; i++) { | |
planetArray[i].render(); | |
} | |
} | |
function mousePressed() { | |
let p = new Planet(mouseX, mouseY, random(50)); | |
planetArray.push(p); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let planetArray; | |
class Planet { | |
constructor(x, y, mass) { | |
this.location = createVector(x, y); | |
this.velocity = createVector(0, 0); | |
this.acceleration = createVector(0, 0); | |
this.mass = mass; | |
} | |
applyForce(force) { | |
this.acceleration.add(force.div(this.mass)); | |
} | |
// This function takes another planet and applies a force towards this planet | |
attract(other) { | |
// Create a vector from this planet to the other | |
const attraction = p5.Vector.sub(this.location, other.location); | |
// Only attract the other planet if it is not touching this planet | |
if (attraction.mag() > this.mass + other.mass) { | |
// Create a force according to Newton's Law of Gravitation: F = (G*m*M) / (r*r) | |
const force = (this.mass * other.mass) / attraction.magSq(); | |
// Create a normalized vector towards the other planet | |
attraction.normalize(); | |
// Multiply it by the force | |
attraction.mult(force); | |
// Apply the gravitational force | |
other.applyForce(attraction); | |
} | |
} | |
render() { | |
ellipse(this.location.x, this.location.y, this.mass); | |
this.velocity.add(this.acceleration); | |
this.location.add(this.velocity); | |
this.acceleration.mult(0); | |
} | |
} | |
function setup() { | |
createCanvas(800, 800); | |
planetArray = []; | |
} | |
function draw() { | |
background(255); | |
for (let i = 0; i < planetArray.length; i++) { | |
planetArray[i].render(); | |
// Each planet loops over all the other planets and attracts them | |
for (let j = 0; j < planetArray.length; j++) { | |
if (i !== j) { | |
planetArray[i].attract(planetArray[j]); | |
} | |
} | |
} | |
} | |
function mousePressed() { | |
let p = new Planet(mouseX, mouseY, random(50)); | |
planetArray.push(p); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment