Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Mountain Terrain Generator. Now with trees!
ID	4522797677805568
Created	10 years ago, 1451951068948
Updated	6 years ago, 1551063340285
Code	/** * Thank you everyone for getting me on the hot programs list! It really means a lot! * ----- * Wait a minute for it to come down, it takes longer the bigger the canvas size is * ----- * A line made by noise moves down the screen and draws terrain based on the height of the noise * A second line comes down to draw the shadows * ----- * This works with any screen size! * https://www.khanacademy.org/computer-programming/mountain-terrain-generator/4522797677805568?width=800&height=800 (the biggest screensize) * ----- * Leave some feedback or improve it how you see fit, and check out my other projects! * --- * ----- * --- * Things to add or fix: * -Little islands in the middle of the larger bodies of water * -Maybe some chill crabs on the beach * -Boats in the water * -Different "zoom" modes */ //global variable holding the color of the background var backColor = color(0, 0, 0); background(backColor); //this variable stores how wavy the line is var Nscale = 0.005; //how high the line can go var Nheight = 425; //this just makes the line different each time var r = random(10000); //this determines how fast the line moves down. The bigger the screen size the slower it will move down. This is in place only to reduce lag and not make your computer blow up. var canvasSize = new PVector(width, height); var maxDist = dist(0, 0, 800, 800); var minDist = dist(0, 0, 400, 400); var canvasDist = dist(0, 0, canvasSize.x, canvasSize.y); //try changing the int value for some slightly different looks var int = map(canvasDist, minDist, maxDist, 0.8, 0.2); //where the line starts and ends, if it went on forever eventually an "oh noes" alert will show up about a for loop taking too long var startY = map(canvasDist, minDist, maxDist, -250, -275); var endY = height; //the y coordinate for the line moving across the screen var y = startY; //Object constructor for each individual tree var Tree = function(x, y) { this.position = new PVector(x, y); this.size = 0.3; //number of green ellipses on the tree this.bunchNum = random(4, 10); //array to hold the size and position of each green ellipse this.bunchesPos = []; this.bunchesSize = []; }; //A method for making giving values to the green tree ellipses Tree.prototype.declare = function() { for(var i = 0; i < this.bunchNum; i++) { this.bunchesPos.push(new PVector(random(this.size-15, this.size15), random(this.size-8, this.size8))); this.bunchesSize.push(new PVector(random(this.size15, this.size35), random(this.size15, this.size35))); } }; //A method that draws the tree at it's location. It's called "land" because in the future I may want to make different types of trees on different surfaces Tree.prototype.land = function() { fill(99, 50, 7); noStroke(); rectMode(CENTER); rect(this.position.x, this.position.y-this.size30, this.size15, this.size60); this.bunchY = this.position.y - this.size60; for(var i = 0; i < this.bunchNum; i++) { fill(43, 105, 4, 200); ellipse(this.position.x+this.bunchesPos[i].x, this.bunchY+this.bunchesPos[i].y, this.bunchesSize[i].x, this.bunchesSize[i].y); } }; //Object creator for the sea creature who lives in these parts var Nessie = function(x, y) { this.position = new PVector(x, y); this.size = 1; this.dir = 1; }; Nessie.prototype.display = function() { var r = random(); if(r<0.50) { this.dir = -1; } fill(43, 17, 92); noStroke(); bezier(this.position.x, this.position.y, this.position.x-(this.size12this.dir), this.position.y-(this.size20), this.position.x-(this.size18this.dir), this.position.y-(this.size15), this.position.x-(this.size5this.dir), this.position.y); ellipse(this.position.x-(this.size14this.dir), this.position.y-(this.size12), this.size7, this.size4); ellipse(this.position.x+(this.size7this.dir), this.position.y-this.size1, this.size16, this.size8); }; //An array that will hold other arrays of all green points on the line in one frame var totalGreens = []; //An array that holds other arrays of blue water dots var totalWater = []; //A variable that determines how often a tree is drawn var treeOften = 15; //and how often Nessie is drawn var lochOften = 400; //An integer that increases every frame var drawInt = floor(random(treeOften+lochOften)); //I encountered a problem where if there were no green dots to draw a tree on, or water to draw Nessie on, the program froze, these variable fix that var thereAreGreens = false; var thereIsWater = false; //almighty draw function draw = function() { //An array that holds each line of green dots var greens = []; //Array for water dots var waters = []; //the if statement makes the line stop at the endpoint if(y<endY) { //background(backColor); /<<<<<< uncomment this bit to see how it works/ //for loop for each individual point on the line for(var i = 0; i < width; i+=2) { //generates noise based on y and i and the first variable, Nscale var Nval = noise(yNscale + r, iNscale + r); //changes the color based on how high it is to make it look like terrain if(Nval<0.36){ stroke(255, 255, 255); }else if(Nval<0.40){ stroke(145, 139, 145); }else if(Nval<0.48){ stroke(5, 135, 10); //this is where the magic of the trees happens, if the Nval is at a certain point, it pushes it's position into the "greens" array to be used later greens.push(new PVector(i, y+NvalNheight)); //this tells the computer that yes, there are greens on this line, so you can look for a place to put down a tree thereAreGreens = true; }else if(Nval<0.52){ stroke(240, 213, 153); }else if(Nval<0.56){ stroke(63, 121, 227); }else { stroke(109, 152, 227); //pushes the position into the array waters.push(new PVector(i, y+0.52Nheight)); thereIsWater = true; } //makes the point large so there are no gaps into the background strokeWeight(4); //this variable is in place so that the water will be flat var finalY; //the if statement makes the water shadow-less and flat if(Nval>0.52) { finalY = y+0.52Nheight; point(i, finalY); } else { finalY = y+NvalNheight; point(i, finalY); stroke(0, 0, 0, 15); point(i, finalY-2); } } //increases the y so the line actually moves y+=int; } //here we take the array with all the greens of that line, and shove it into the big array, this way trees will only be drawn on the greens on the current line, instead of on ALL the greens on the screen totalGreens.push(greens); totalWater.push(waters); //if the integer increasing every frame is evenly divisible by "treeOften" and there are greens on this row of dots... if(drawInt%treeOften === 0 && thereAreGreens) { //choose one point from the list of dots, var t = floor(random(greens.length)); //and draw a tree there. Simple as that var tree = new Tree(greens[t].x, greens[t].y); tree.declare(); tree.land(); } //draws Nessie if the conditions are met if(drawInt%lochOften === 0 && thereIsWater) { var w = floor(random(waters.length)); var nessie = new Nessie(waters[w].x, waters[w].y); nessie.display(); } //Increases the integer drawInt++; //resets the awareness of greens and water thereAreGreens = false; thereIsWater = false; //println(totalWater); };
Folds	50,58,60,65,67,77,80,84,85,95
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgOin3q6ECAw
Votes	218
Spin-Offs	30
Type	PJS
Width	400
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Harrison DeMoss
Author Name	HarrisonTheMighty
Author ID	kaid_547603459149084370678045
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739362897478
Updated	10 months ago, 1739362903377
Source Deleted	unknown