GMU:Processing im Park/Jason Langheim: Difference between revisions

← Older edit

GMU:Processing im Park/Jason Langheim (view source)

Revision as of 09:21, 28 March 2016

2,673 bytes added , 28 March 2016

→‎Final Project "natürlich"

JL

43

edits

@@ Line 256: / Line 256: @@
 </source>
-== Final Project ==
+== Final Project "natürlich" ==
 ''My final prohect trys to discuss the topic of nature. What's natural at all? Aren't the things we consider as natural, like forests or rivers, influenced by humans and so  therefore not "natural". So if these things are nature, why isn't the city, with all its streets and buildings, nature after a while?
-''The Processing sketch I made for my final project shows the nature and then a randomly generated tree, which is filled with the texture of a city to symbolise this topic. You can restart the sketch with a key and it will draw a new random tree.
+''The Processing sketch I made for my final project shows the nature and then a randomly generated tree, which is filled with the texture of a city to symbolise this topic. You can restart the sketch with a key and it will draw a new random tree. This is how i proceed:
 ''
 [[File:Documentation.gif]]
-[[File:Result.png]]
+''After having troubles creating the trees and creating the masks, i succeeded. Now that is the final code:''
+<source lang = "java">
+//"natürlich" by Jason Langheim
+//This sketch creates random trees and applys them as masks
+//on pictures of cities and puts them on top of another picture.
+//creating the variables
+PImage img;
+PImage bg;
+PImage[] parts = new PImage[500];
+PImage[] masks = new PImage[500];
+PGraphics tree1;
+int x = 0;
+int y = 500;
+int y1 = 500;
+int ym = 500;
+int frame = 0;
+PImage m;
+int b=0;
+//create an array of slices of the city picture and the mask
+void setup(){
+ frameRate(15);
+ size(500,500);
+ smooth();
+ tree1 = createGraphics(500,500);
+ img = loadImage("Haus.jpg");
+ m = loadImage("m.png");
+ bg = loadImage("Wald.png");
+ bg.resize(width,height);
+ img.resize(width,height);
+  for (int o=0 ; o < parts.length; o++)
+ {
+  image(img, 0, 0);
+  y = y - 1;
+  parts[o] = get(x,y,500,1);
+  parts[o].loadPixels();
+ }
+ for (int p=0 ; p < masks.length; p++)
+ {
+  image(m, 0, 0);
+  ym = ym - 1;
+  masks[p] = get(0,ym,500,1);
+ }
+ }
+//gray scale the background and apply the masks on the city
+void draw() {
+   bg.filter(GRAY);
+   background(bg);
+   bg.mask(m);
+   println(frame);
+   y1 = height - 1;
+   masks[frame].mask(parts[frame]);
+   y1 = y1 - (frame * 1);
+   image(parts[frame],0,y1);
+   image(bg,0,0);
+   frame = frame + 1;
+   if( frame  >= 500){
+     frame = 0;
+   }
+  }
+//funtion to create random trees using math
+void branches(float beginX, float beginY, float bLength, float angle)
+{
+  float endX = beginX + bLength*cos(angle);
+  float endY = beginY + bLength*sin(angle);
+  strokeWeight(map(bLength, height/4, 3, 20, 1));
+  stroke(0);
+  line(beginX, beginY, endX, endY);
+  if (bLength  > 3)
+  {
+    if (random(1) > 0.1) branches(endX, endY, bLength*random(0.6, 0.8), angle - random(PI/15, PI/5));
+    if (random(1) > 0.1) branches(endX, endY, bLength*random(0.6, 0.8), angle + random(PI/15, PI/5));
+      fill(0);
+      noStroke();
+      ellipse(endX, endY,(random(10)+2),(random(10)+2));
+  }
+}
+//function that draws the tree
+void mask(){
+  tree1.beginDraw();
+  background(255,255);
+  for(int i= 0 ; i<5;i++){
+  branches(width/2, height, height/5, -HALF_PI);
+  alpha(0);
+  }
+  tree1.endDraw();
+}
+//redraw a random tree when a key is pressed and reset the background
+void keyPressed(){
+  mask();
+  save("data/" + "m.png");
+  background(0);
+  m = loadImage("m.png");
+  for (int p=0 ; p < masks.length; p++)
+ {
+  image(m, 0, 0);
+  ym = ym - 10;
+  masks[p] = get(0,ym,500,1);
+ }
+ frame = 0;
+ bg = loadImage("Wald.png");
+ bg.resize(width,height);
+}
+</source>
+<br style="clear:both;">
 [https://www.flickr.com/photos/137372572@N08/26087001545/ The Result]
+[[File:Result.png]]