[SOLVED] Convert sketch from 2D to 3D

borgejor

I am trying to convert my root system sketch from 2D to 3D so I can rotate around it and be able to see it from different angles. My friend told me about using PVectors to implement the z-axis but I am not sure about how to do that. Any body help? Sorry I am new to using a forum so forgive me if I am not asking properly or giving enough information. My code is below:

Snake[] snakes = new Snake[0];

void setup() {

  background(0);
  size(1200, 600,P3D);

  smooth();
      for (int k = 0; k < 10; k++){
         snakes = (Snake[]) append(snakes, new Snake(width/2, height/2, 15, random(100), 1));
      }
}
void draw() {

  for(int i = 0; i < snakes.length; i++) {
    if(!snakes[i].done()){
    snakes[i].go();
    stroke(random(255), 0, 0, 50);}
  }



}





class Snake {

  float X;
  float Y;
  float rot;
  float V;
  float tm;
  int fm;

  Snake(int tX, int tY, float tfm, float trot, float tV) {
    X = tX;
    Y = tY;
    rot = trot;
    tm = tfm;
    V = tV;
  }

  void go() {
    V += random(-0.01, 0.01);
    tm /= 1.01;
    strokeWeight(tm);
    rot += random(-0.2, 0.2);
    line( X,Y, X + V*sin(rot), Y + V*cos(rot));
    line(X, Y, X + V*sin(rot), Y + V*cos(rot));
    X += V*sin(rot);
    Y += V*cos(rot);

    fm++;
    if(random(400) > 398.5-(fm/20)) {
      snakes = (Snake[]) append(snakes, new Snake(int(X), int(Y), tm, rot + random(-0.2, 0.2), V));

    }
  }
  boolean done() {
    if(tm < 0.01) {
      return true;
    }else{
      return false;
    }
  }
}

koogs

PeasyCam library

but that won't work because you're only drawing one step at a time - if you start rotating the screen then only the things you draw after rotating will be rotated, not the whole thing.

G_D

Do you want the root system to grow in 3d, and then be able to rotate it. Or have the existing 2d root system that you can rotate in 3d?

borgejor

I would love for it to be able to grow in 3D, even if I couldn't rotate it, growing in three dimensions would be enough. Would you able to show me how to do that?

Chrisir

In line 31/33 add float Z;

Line 51 is the same as 52

It might be faster to store old x and y and calc new x and y draw the line between them

(Swap 53/54 and 51)

to go 3D add a calc for Z here

Use Z in the line() command with 6 Parameters

Chrisir

To fight what koogs said you can put the 3D data in a arraylist and display this

koogs

but you'll have to redraw the entire structure every time (or at least when it changes)

even if I couldn't rotate it, growing in three dimensions would be enough

but the display will still be in 2d so the third dimension is a waste

take a piece of paper. draw a cube. is that 3d or 2d?

borgejor

This is all great guys, but I am having trouble following how to actually convert my code to have a Z axis and make it 3D. Can anyone show me what the code would look like?

Chrisir

Snake[] snakes = new Snake[0];

ArrayList<Line> lines = new ArrayList(); 
float angleRotate=0.0;
color  colRed; 

void setup() {

  size(1600, 900, P3D);
  background(0);

  noSmooth();

  // colRed= color(random(255), 0, 0, 50);
  colRed= color(random(255), 0, 0);

  for (int k = 0; k < 10; k++) {
    snakes = (Snake[]) append(snakes, new Snake(0, 0, 230, 15, random(100), 1));
  }

  println("make tree");

  for (int k = 0; k < 304; k++) {
    // loop over snakes 
    for (int i = 0; i < snakes.length; i++) {
      if (!snakes[i].done()) {

        //  stroke(random(255), 0, 0, 50);
        snakes[i].go();
      }
    }
  }

  snakes=null; 

  println("done tree");
}

void draw() {

  background(0);
  lights();

  translate(width/2, height/2);
  rotateY(angleRotate); 

  directionalLight(51, 102, 126, 0, -1, 0);

  for (Line currentLine : lines) {
    currentLine.display();
  }

  angleRotate+=.01;

  showTextInHUD("press any key");
}

// Head-up-Display 
// see http://de.wikipedia.org/wiki/Head-up-Display
void showTextInHUD(String str1) {
  // A small 2D HUD for text in the
  // upper left corner. 
  // This func may only be called a the very end of draw() afaik.
  camera();
  hint(DISABLE_DEPTH_TEST);
  noLights();
  //textMode(MODEL);
  fill(255);
  text(str1, 20, 20);
  hint(ENABLE_DEPTH_TEST);
} // func 


// ==========================================================================


class Snake {

  float X;
  float Y;
  float Z;

  float rot;
  float V;
  float tm;
  int fm;

  Snake(int tX, int tY, int tZ, 
    float tfm, float trot, float tV) {
    X = tX;
    Y = tY;
    Z = tZ; 

    rot = trot;
    tm = tfm;
    V = tV;
  }

  void go() {
    // V += random(-0.01, 0.01);
    V += random(0, 0.01);
    //V = random(0, 2.01);

    tm /= 1.01;
    //   strokeWeight(tm);
    rot += random(-0.2, 0.2);

    float oldX=X;
    float oldY=Y;
    float oldZ=Z;

    X += V*sin(rot);
    Y += V*cos(rot);
    Z += random ( -13, 13); // // V*cos(rot)*2;

    // line( X, Y, X + V*sin(rot), Y + V*cos(rot));
    // line( X, Y, X + V*sin(rot), Y + V*cos(rot));

    //line(oldX, oldY, oldZ, 
    //  X, Y, Z); 

    lines.add(
      new Line(oldX, oldY, oldZ, 
      X, Y, Z, 
      tm, 
      colRed
      )); //   color(random(255), 0, 0)

    fm++;
    if (random(400) > 398.5-(fm/20)) {
      snakes = (Snake[]) append(snakes, new Snake(int(X), int(Y), int (Z), tm, rot + random(-0.2, 0.2), V));
    }
  }

  boolean done() {
    if (tm < 0.01) {
      return true;
    } else {
      return false;
    }
  }
}

// =========================================

class Line {

  float x1, y1, z1;
  float x2, y2, z2;
  float tm;
  color col;

  Line(float x1_, float y1_, float z1_, 
    float x2_, float y2_, float z2_, 
    float tm_, 
    color col_ ) {
    x1=x1_;
    y1=y1_;
    z1=z1_;

    x2=x2_;
    y2=y2_;
    z2=z2_;

    tm=tm_;
    col=col_;
  }

  void display() {
    if (keyPressed)
      display2(); 
    else
      display1();
  }

  void display2() {
    stroke(col);
    line(x1, y1, z1, 
      x2, y2, z2);
  }

  void display1() {
    drawLine(x1, y1, z1, 
      x2, y2, z2, 
      tm, 
      col);
  }

  void drawLine ( float x1, float y1, float z1, 
    float x2, float y2, float z2, 
    float weight, 
    color fillColor)
    // drawLine programmed by James Carruthers
    // see http://processing.org/discourse/yabb2/num_1262458611.html#4
    // It is a 3D-replacement for the Line from x1,y1,z1 to xy,y2,z2 with
    // weight and fillColor.
  {
    PVector p1 = new PVector(x1, y1, z1);
    PVector p2 = new PVector(x2, y2, z2);
    PVector v1 = new PVector(x2-x1, y2-y1, z2-z1);
    float rho = sqrt(pow(v1.x, 2)+pow(v1.y, 2)+pow(v1.z, 2));
    float phi = acos(v1.z/rho);
    float the = atan2(v1.y, v1.x);
    v1.mult(0.5);

    pushMatrix();
    translate(x1, y1, z1);
    translate(v1.x, v1.y, v1.z);
    rotateZ(the);
    rotateY(phi);
    noStroke();
    fill(fillColor);
    box(weight, weight, p1.dist(p2)*1.2);
    popMatrix();
  } // function 
  //
}//class 
// 

Chrisir

that is one approach.

The snakes are only used in setup() and are just there to help to build the lines (in the ArrayList lines. An ArrayList is a more comfy array).

you don't watch the tree grow, it is just there (I think it would be too slow otherwise)

Chrisir

it also makes use of a more advanced line which can take shadows

this function drawline by James Carruthers basically makes a long box between our 2 points

borgejor

Thank you. Definitely in the direction I want my project to go! Awesome

koogs

you don't watch the tree grow, it is just there (I think it would be too slow otherwise)

You could animate it by varying how much of the pre-calculated tree you draw with each frame (assuming the trunk is drawn first). That would actually be less work (ie faster) than drawing the whole tree ever time.

If you don't want animation but want better efficiency then pshapes would probably be better, as they'd reduce the number of internal calls to the renderer by batching things up. That's badly explained, it is early here 8)

Chrisir

2 good ideas, thank you!

koogs

(Not sure the second would work with your Lines though, they wouldn't rotate to face the camera...)

Chrisir

Dunno