What's matter with this drawing?

edited October 2013 in Questions about Code

image alt text I try to draw a group of rays, like the following codes. I wish to see it acting as an animation, I add a delay 100ms in order to see the change rate and draw little by little, but even I reduce the delay to 1ms, the effect can not occur, it shows only black ground, and after long waiting, it shows all the picture suddenly, Im afraid it maybe caused by flush, I add a background bellow, but no use. what does it take place?

int width = 530, height = 600;
void setup() {      
    size(width, height);        
    smooth();      
    noStroke();    
    fill(200, 30, 200);  
   }
void draw() {     
   background(0);     
   for (int i = 0; i <= 120; ++i) {      
       for (int j = 0; j <= 120; ++j) {        
           float r = i*5;       
           float x = 230+r*cos(PI/30*j);       
           float y = 60+r*sin(PI/30*j);       
           ellipse(x, y, 3, 6); 
      delay(1); //even reduce to 1ms;
  //background(0);  //add herewith  
        }    
    }
}
Tagged:

Answers

  • Answer ✓

    I refactored your code a bit and added some comments. Should help you understand better what's happening in your code:

    int width = 530, height = 600;
    void setup() {      
      size(width, height);        
      smooth();      
      noStroke();    
      fill(200, 30, 200);
    }
    
    void draw() {     
      thisFunctionCalled60TimesPerSecond();
    }
    
    void thisFunctionCalled60TimesPerSecond() {
      background(0);  // so you clear screen 60 times per second    
      // then this nested loop which results in 14400 iterations will 
      // be called 60 times per second
      for (int i = 0; i <= 120; ++i) {      
        for (int j = 0; j <= 120; ++j) {        
          float r = i*5;       
          float x = 230+r*cos(PI/30*j);       
          float y = 60+r*sin(PI/30*j);       
          ellipse(x, y, 3, 6);
         // this delay, because it is inside of nested loop,
         // inside of each frame will be executed 14000 times. 
         // resulting in 14second delay 
          delay(1); //even reduce to 1ms;  
    
          //background(0);  //add herewith
        }
      }
    }  
    
  • Answer ✓

    Consider draw() itself as a big loop. And you can control its FPS speed w/ frameRate().

  • _vk_vk
    edited October 2013

    also this might help understanding as well, then u can use frameRate() as GoToLoop said:

    int width = 530, height = 600;
    int i=0;
    void setup() {      
      size(width, height);        
      smooth();      
      noStroke();    
      fill(200, 30, 200); 
      background(0);
    }
    void draw() {         
      for (int j = 0; j <= 120; ++j) {        
        float r = i*5;       
        float x = 230+r*cos(PI/30*j);       
        float y = 60+r*sin(PI/30*j);       
        ellipse(x, y, 3, 6); 
      }    
      i++;
    }
    
  • Why does my pc look the code strange? all of them are in one line without any format. except different color to distinguish them. what's matter? I use xp os.

  • It seems browser's problem, I change chroma, then all is done. is it not fitting to ie?

  • dimkir, I may not understand what your saying, what's different from my origianl code? it seems all the same.

  • edited October 2013

    To All, could you explain why ellipse can be redrawed once a time in the circle?

    for (int i = 0; i <= 120; ++i) {      
        for (int j = 0; j <= 120; ++j) {        
          float r = i*5;       
          float x = 230+r*cos(PI/30*j);       
          float y = 60+r*sin(PI/30*j);       
          ellipse(x, y, 3, 6); // why don't display once a cycle?
          //until all cycles are done.
    
          delay(1); //even reduce to 1ms;
    

    This is what I want to know.

  • The difference are the comments... :)

  • _vk_vk
    edited October 2013

    Once execution goes inside a for loop, it loops until condition is met, and only then continues, Processing renders the frame to be displayed only as the last thing in draw. So when the display is rendered all iterations that draw all ellipses have already happen... check this out... It illustrates the rendering at the end of the draw, try comment out line 6...

    void draw(){
      //background(80);//will work! and uncomment this
      fill(255,0,0);//red
      ellipse(random(width),random(height), 20, 20);
      println(frameCount); // I'm looping...
      background(80);//WRONG!! comment this out
    }
    
  • edited October 2013

    well, look at this sample,

    void setup() {
      //frameRate(4);//delete it here, instead of delay() below.
    }
    int pos = 0;
    void draw() {
      background(204);
      pos++;
      line(pos, 20, pos, 80);  
      if (pos > width) {
        pos = 0;
      }
     delay(300); // it works well, as same as frameRate(),
    }
    

    at this example, the line draws very well each cycle, but above ellipse cannt be done.

  • edited October 2013
    void setup() {
      frameRate(4);
    }
    int pos = 0;
    void draw() {
      background(204);
      pos++;
      line(pos, 20, pos, 80);
      if (pos > width) {
        pos = 0;
      }
    }
    

    -k-

  • _vk_vk
    edited October 2013

    Please format your code properly, no [code] tags, paste it, select it, and hit 'C' button above edit area. Or ident each line 4 spaces... :) I can't copy it like this. I remeber there is an article about this in wiki, with a much better explanation... here it is:

    http://wiki.processing.org/w/I_display_images_in_sequence_but_I_see_only_the_last_one._Why?

  • _vk_vk
    edited October 2013

    There is no for loop () in this new code... If you add one...

    void setup() { 
      frameRate(4);
    } 
    int pos = 0; 
    void draw() { 
      background(204); 
      pos++; 
      line(pos, 20, pos, 80); 
      if (pos > width) { 
        pos = 0;
      }
      for(int i = 0; i < 10; i++){
        line(width-pos - i * 5 , 20, width-pos - i * 5, 80);
      }
    
    }
    

    you see, you cant see each line of the group, they are all draw at once

  • I hit "c" frequently and heavily :( , but nothing happened. I try to use code, but no use, either. what's matter?

  • edited October 2013

    -mmm- mmm mmmmmmm****mm code code well, only but this C can not paly a role, nor is cotr-k.

  • edited October 2013

    image alt text>

    code well, only but >

    this forum is odd enough to post. Im afraid I have to learn it again how to use it.

  • edited October 2013

    There is no for loop () in this new code>

    draw() function itself is a loop, unless you use noLoop() in set up part.

  • An alternative option for button C is use CTRL+K. :(|)

  • edited October 2013

    Nor is ctrl+k, as I said above, no use. nothing take place. what's matter? neither IE can do, nor chrome .

  • and it seems sometime entry can not act look up, it lines up in one line.

  • What I wonder is my top thread use code braket the code, it well done, but not the follow. what browser are you all using?

  • } for(int i = 0; i < 10; i++){ line(width-pos - i * 5 , 20, width-pos - i * 5, 80);//when this function excutes? } } you see, you cant see each line of the group, they are all draw at once

    look my comment, when will the line() execute? as if the function when be in a local part will not draw in time in a cycle?

    Im afraid this is what the problem is.

  • I think I can use a static variable to solve the problem.

  • and interest, when I finish to post, a error occurs and have to reflash to rewite to post, :(

  • _vk_vk
    edited October 2013 Answer ✓

    about forum format:

    http://forum.processing.org/two/discussion/32/how-to-format-text-and-code-on-the-new-forum#

    when will the line() execute?

    You can see that for your self :)

    void setup() { 
      frameRate(1);
    } 
    int pos = 0; 
    void draw() { 
      println("**********I'm frame " + frameCount + " begning to execute****************");
      background(204); 
      pos++; 
      line(pos, 20, pos, 80); 
      println("I just draw left line in this frame, but not rendered it yet\n");
      if (pos > width) { 
        pos = 0;
      }
      for (int i = 0; i < 10; i++) {
        println("This is the iteration number: " + i + " of the for loop begning to execute");
        line(width-pos - i * 5, 20, width-pos - i * 5, 80);
        println("I just draw right line number " + i +  " in this frame, but not rendered it yet\n");
      }
    
      println("***********   I'm frame " + frameCount + " ending to execute and rendering this frame to display  ********\n\n");
    }
    

    edit: maybe you should report formatting issue in the thread linked above

  • thank you , I understand what you aer saying. .

Sign In or Register to comment.