Blending two PGraphics keeps stroke lines... Why?

Hi all!

I'm blending two different PGraphics with DIFFERENCE and the final result I'm searching for is only shapes, without any kind of border/stroke. However, I'm still getting some jagged lines between each shape...

Maybe it's something related to the math behind PGraphics and blending two set of pixels. Don't know and would be extremely happy if somebody could give me some light regarding this issue (:

Well, here's the code that I'm working on right now:

PGraphics c;
PGraphics d;
int p = 50;
PVector padding = new PVector(p,p*1.618);

void setup() {
  size(600, 600);
  background(244);
  c = createGraphics(width, height, JAVA2D);
  d = createGraphics(width, height, JAVA2D);
  c.beginDraw();
  c.smooth();
  c.endDraw();
  d.beginDraw();
  //d.background(255);
  d.smooth();
  d.endDraw();
  noLoop();

  println(c.stroke);

}

void draw() {  
  background(244);

  drawTriangle(padding.x, 0, width-padding.x, height/2, width-padding.x, height);
  drawTriangle(width-padding.x, 0, padding.x, height/2, padding.x, height);
  drawTriangle(padding.x, height, width-padding.x, height/2, width-padding.x, 0);
  drawTriangle(width-padding.x, height, padding.x, height/2, padding.x, 0);

  drawTriangle(0, padding.y, width/2, height-padding.y, width, height-padding.y);
  drawTriangle(width, padding.y, width/2, height-padding.y, 0, height-padding.y);
  drawTriangle(0, height-padding.y, width/2, padding.y, width, padding.y);
  drawTriangle(width, height-padding.y, width/2, padding.y, 0, padding.y);

}

void drawTriangle(float x1, float y1, float x2, float y2, float x3, float y3){
  c.beginDraw();
  c.background(0, 0);
  c.fill(244);
  c.noStroke();
  //c.stroke(244,0);
  c.triangle(x1,y1,x2,y2,x3,y3);
  c.endDraw();

  d.blend(c, 0, 0, width, height, 0, 0, width, height, DIFFERENCE);

  image(d,0,0);
}

Answers

  • edited October 2015

    Well, I tried not using PGraphics and used blendMode(DIFFERENCE).

    Unfortunately, I got almost the same results although the overlay between each shape works better than with PGraphics. Lines still appear in some specific places. Here's the code for DIFFERENCE between shapes without using PGraphics:

    float p = random(50,100);
    PVector padding = new PVector(p,p*1.618);
    
    void setup() {
      size(600, 600, JAVA2D);
      background(244);
      noLoop();  
    }
    
    void draw() {  
      background(244);
      fill(244);
      noStroke();
      //stroke(255,0);
      blendMode(DIFFERENCE);
    
      triangle(padding.x, 0, width-padding.x, height/2, width-padding.x, height);
      triangle(width-padding.x, 0, padding.x, height/2, padding.x, height);
      triangle(padding.x, height, width-padding.x, height/2, width-padding.x, 0);
      triangle(width-padding.x, height, padding.x, height/2, padding.x, 0);
    
      triangle(0, padding.y, width/2, height-padding.y, width, height-padding.y);
      triangle(width, padding.y, width/2, height-padding.y, 0, height-padding.y);
      triangle(0, height-padding.y, width/2, padding.y, width, padding.y);
      triangle(width, height-padding.y, width/2, padding.y, 0, padding.y);
    
    }
    
    void mousePressed(){
     redraw(); 
    }
    
Sign In or Register to comment.