"erasing" (in SVG mode) - i.e. background color with no background

kirkjerk · April 2017

This might be "kicking against the sticks" (especially given the way SVGs are generated!) but is there any way to set a stroke color (or something) that "erases"?

I managed to get a decent pie-chart-like arc by having arcs with no fill but VERY thick line (with square line enscaps) for the outline of the arc, the trouble is gap between the segments is wider at the outside of the circle than the middle of the circle. Visually, I'd like it to look like a line of fixed width was drawn between the sections, which would be easy enough to do if I had a background color (just set the stroke color to the same thing and go) but I don't think it's possible since I'm keeping things transparent for making SVGs off of it.

prince_polka · April 2017

Wheter this will work with p5 or SVG mode I don't know, never used it but took a look at the p5 reference and createGraphics() and blendMode is there so hope this helps

PGraphics canvas;
void setup(){size(400,400);
blendMode(REPLACE);
canvas =  createGraphics(width,height);
}
void draw(){
  background(frameCount%256); // breathing background
  canvas.beginDraw();
  canvas.blendMode(REPLACE);
  canvas.background(0x0000ff00);
  canvas.fill(#00ff00);
  canvas.noStroke();
  canvas.ellipse(width/2,height/2,width,height);
  canvas.stroke(0x0000ff00);
  canvas.strokeWeight(40);
  canvas.line(0,height/2,width,height/2);
  canvas.line(width/2,0,width/2,height);
  canvas.endDraw();
  image(canvas,0,0);
}

Howdy, Stranger!

Categories

In this Discussion

"erasing" (in SVG mode) - i.e. background color with no background

Answers