Pgraphics clear() does not work !

atomtm

Hello everyone! I am trying to create a simple sine wave connected to a circle , by a single line . The thing is that I want the line to disappear each time it is drawn ,so I used Pgraphics. I have assigned it to pg and on mouse click I call pg.clear() . So far I have tried this :

int constant = 100;
float angle = 0;
int scalar = 100;
float speed = 1;
int offset_cir = 200;
PGraphics pg;

void setup(){
size(1027,768);
smooth();
background(255);
pg = createGraphics(width,height);


}


void draw(){
//background(255);
float rad= radians(angle);
float x = constant + sin(rad+PI/2) * scalar;
float y = height/2 + cos(rad+PI/2) * scalar;
float x_w = rad*10;

//X-AXIS

line(0,height/2,width,height/2); 

// circle
ellipse(x,y,1,1); 




//wave
ellipse(x_w+offset_cir,y,1,1);


//CONNECTION LINE
pg.beginDraw();
pg.background(255,0);
pg.stroke(0);
pg.line(x,y,x_w+offset_cir,y);
pg.endDraw();
image(pg,0,0);


//ANGLE INC
angle = angle + speed;

//delay(1000);
}


void mousePressed() {
pg.clear();  
}

Unfortunately there is no change when I click !

Am I missing something ?

Thank you in advance

MenteCode

The code is run like this because you're using PGraphics a little backwards.

That is said relative to everything in your code, so I won't state everything that went wrong here.

But the general purpose of PGraphics is to draw on top of the sketch, as I'm sure you know.

But that doesn't mean that PGraphics will be redrawn, just because the background, call is used on it.

Anyway, here's is the code that does what you actually wanted to:

int constant = 100;
float angle = 0;
int scalar = 100;
float speed = 1;
int offset_cir = 200;
PGraphics pg;

void setup() {
  size(1027, 768);
  smooth();
  background(255);
  pg = createGraphics(width, height);

}


void draw() {
  background(255);
  float rad= radians(angle);
  float x = constant + sin(rad+PI/2) * scalar;
  float y = height/2 + cos(rad+PI/2) * scalar;
  float x_w = rad*10;

  //X-AXIS

  line(0, height/2, width, height/2);  
  line(x, y, x_w+offset_cir, y);

  //CONNECTION LINE
  pg.beginDraw();
  pg.stroke(0);
  // circle
  pg.ellipse(x, y, 1, 1);
  // wave
  pg.ellipse(x_w+offset_cir, y, 1, 1);
  pg.endDraw();
  image(pg, 0, 0);


  //ANGLE INC
  angle = angle + speed;

  //delay(1000);
}


void mousePressed() {
  pg.clear();
}

Just see how things are different, and maybe things will become more apparent to you.

atomtm

Thank you so much ! I really appreciate it. By the way I read on the reference that createGraphics() is a Class and not a method from PGraphics. How could this be implemented in OOP (Asking for educational reasons).

GoToLoop

Actually, method createGraphics() belongs to the most import Processing framework's class: PApplet:

• http://processing.org/reference/createGraphics_.html
• https://github.com/processing/processing/tree/master/core/src/processing/core

Its task is to instantiate 1 of the PGraphics's subclasses and initialize its complicated stuff.
Then return it to us ready-to-use! \m/ In other words, it replaces: new PGraphics(). <:-P

That is so b/c a PGraphics object is incomplete! It's gotta be 1 of its full derivative classes!
createGraphics() works as entry point in order to get the right subclass! *-:)

You can read more about it in these 2 threads below:

• forum.processing.org/two/discussion/6884/question-about-pgraphics
• forum.processing.org/two/discussion/5238/creating-a-layer-class-that-extends-pgraphics

atomtm

Thank you very much !