Loading...
Logo
Processing Forum
Hi there, 

I hope someone can help me on this project! Its giving me a headache!

I understand that the nature of processing means that if you move the camera position, you must redraw everything. 

My problem is that I am generating a line that extends and occasionally splits off and changes course and i want the camera to always slowly be zooming out so that the content always fits the window. But ofcourse, when i move the camera, it messes up what the drawing.. 

Here's my sketch so far, any help would be greatly appreciated!

Copy code
  1. import processing.opengl.*;

  2. Spiral[] mySpirals;

  3. int xpos = 0;
  4. int ypos = 0;
  5. int spiralcount = 0;
  6. int direction = 0;


  7. void setup() {
  8.   size(800,600,OPENGL);
  9.   background(255);
  10.   smooth();
  11.   
  12.   xpos = width/2;
  13.   ypos = height;
  14.   
  15.   mySpirals = new Spiral[10];
  16.   
  17.   for(int i = 0; i < 10; i++) 
  18.   {
  19.     mySpirals[i] = new Spiral();   

  20.   }
  21.   
  22.   
  23. }


  24. void draw(){

  25.   noStroke();
  26.   fill(0);
  27.  ellipse(xpos, ypos, 16, 16); 
  28.  ypos -= 1;
  29.  
  30.  for(int i = 0; i < 10; i++) 
  31.   {
  32.  if(mySpirals[i].done==true)
  33.    mySpirals[i].drawit();
  34.    
  35.   }
  36.  
  37.  }
  38.  

  39.  void mouseClicked() {
  40.    
  41.    mySpirals[spiralcount].ypostart = ypos;
  42.    mySpirals[spiralcount].done=true;
  43.    spiralcount++;
  44.    if(direction==0){direction=1;}else{direction=0;}
  45.   }
  46.   
  47.   
  48. class Spiral{

  49. float r = 60;
  50. float theta = 0;
  51. float lt = 16;
  52. float cize = random(0.2, 4);
  53. float direction = int(random(0,2));



  54. int ypostart = 0;
  55. boolean done = false;



  56. void drawit() {  
  57.   //println(direction);
  58.   if(lt>0){
  59.   // Polar to Cartesian conversion
  60.   float x = 0;
  61.   if(direction==1){
  62.    x = r * cos(theta)*cize;} //change to a minus + add60*cizeinstead of minus below to flip
  63.   if(direction==0){
  64.    x = r * -cos(theta)*cize;}
  65.   
  66.   float y = r * sin(theta)*cize;

  67.   // Draw an ellipse at x,y
  68.   noStroke();
  69.   fill(0);
  70.   if(direction==1){
  71.   ellipse(x+width/2-(60*cize), y+ypostart, lt, lt);}
  72.   if(direction==0){
  73.   ellipse(x+width/2+(60*cize), y+ypostart, lt, lt);}

  74.   // Decrement the angle
  75.   theta -= 0.02;
  76.   // Deccrement the radius
  77.   r -= 0.1;
  78.   //Decrement the thickness
  79.   lt -= 0.03;
  80.   //println(r);
  81.   }else{
  82.   
  83.  done = true;
  84.   }
  85. }

  86. }

Replies(6)

do you just need a background(255); at the start of the draw to clear the screen for the new frame?
'fraid not...  Basically every new frame, or iteration of draw(), it adds to the animation.  

It should clear the frame and redraw it I know... but I don't know how to save whats there so that it can be re-drawn with a new camera angle at the start of the next frame.


Am i making sense?
There are different approaches you could take with this...  I'd be tempted to draw to a separate buffer image that's larger than the screen and then scale/position that to implement the zoom-out; otherwise I think you're stuck with having to store the path of each line and redraw from scratch each frame.

On a separate note: you've set the length of the mySpirals array to 10, but have done nothing to avoid ArrayIndexOutOfBounds errors.  You'd actually be better off using an ArrayList which makes it easier to manage multiple objects: you can just keep adding them as they are created, meaning you don't have to set the length of the list at setup...
Hi blindfish, thanks for the reply.

About the array, nice one! I haven't used  Arraylist before but i will now.

I like the image buffer idea... is it possible to draw to it in a similar way to how i currently am?  How might i go about doing that?
Have a look at PGraphics ;)
Cool, Ive got it to work.. looks great but runs at about 3 fps!!