processing4 icon indicating copy to clipboard operation
processing4 copied to clipboard

SVG Export does not match sketch

Open matiasw opened this issue 1 year ago • 1 comments

Description

When exporting a sketch as SVG from Processing 4.3 with processing.svg, the result is not what the sketch renders in Processing.

Expected Behavior

I expect the exported SVG to match what is drawn by the internal Processing graphics renderer, which is this: image

Current Behavior

Instead of matching the output from the sketch, what gets exported into the SVG is this: image

Steps to Reproduce

  1. Draw the Flower of Life pattern recursively. Because the implementation details are irrelevant here (I think?), I am only giving the code for rendering (setup and draw), which is here:
void setup()
{
  strokeWeight(4);
  stroke(200, 0, 0);
  noFill();
  ellipseMode(RADIUS);
  //size(1920, 1080);
  background(0);
  fullScreen();
}

void draw()
{
  beginRecord(SVG, "flower_of_life_field.svg");
  int R = 100;
  Circle c1 = new Circle(new PVector(SCREENWIDTH/2, SCREENHEIGHT/2), R);
  Circle c2 = new Circle(new PVector(c1.center.x + R, c1.center.y), R);
  Circle[] circles = new Circle[2];
  circles[0] = c1;
  circles[1] = c2;
  circles = iterate(circles, 7);
  for (Circle c: circles)
  {
    //println("Draw ellipses at ", c.center.x, c.center.y);
    circle(c.center.x, c.center.y, c.r); 
  }
  endRecord();
}
  1. Observe what is on the screen.
  2. Open the exported SVG and notice that it is different.
  3. Create this bug report.

Your Environment

  • Processing version: 4.3
  • Operating System and OS version: Windows 10 Pro, build 19045.4291

Possible Causes / Solutions

This could also be an issue with the SVG library that Processing uses, in which case I will take this upstream, but I thought to report it here, first.

If I had to guess, I would say this has something to do with ellipseMode(RADIUS).

matiasw avatar Apr 21 '24 12:04 matiasw

Ah right, after refreshing my memory about another SVG issue I had: https://github.com/benfry/processing4/issues/803

...I got it to work by moving the ellipseMode call between the beginRecord and endRecord.

So, is this just user error on my part? I thought the SVG exporter is supposed to always match what gets drawn to the screen, but maybe I've got that wrong, and it actually just dumps whatever drawing happens between the begin and end calls? In that case, you may close the issue.

matiasw avatar Apr 21 '24 12:04 matiasw