SVG shape distortion when importing back in processing

Processing Coding Questions
1 
// Shape
import processing.svg.*;

float lengthD;
float ellipseR;
float rhombusW;
float rhombusH;

void setup() {
  size(800, 800);
  beginRecord(SVG, "SHAPE.svg");
  
  smooth(); 
  noLoop();
   
  lengthD  = sqrt(pow(width, 2)+pow(height, 2));
  ellipseR = 175;
  rhombusH = ((lengthD/2) - ellipseR)/2;
  rhombusW = rhombusH*0.6;  
}

void draw() {
  background(0);
  fill(255);
  noStroke();
  translate(width/2, height/2);   
  ellipse(0,0,ellipseR*2,ellipseR*2);
  
  for (int i=0; i<4; i++) { 
    pushMatrix();
    translate(cos(radians((i*90)+45))*(lengthD/2-rhombusH), sin(radians((i*90)+45))*(lengthD/2- 
    rhombusH));
    rotate(radians((i*90)+45));
    beginShape();   
    vertex(0, rhombusW);
    vertex(-rhombusH, 0);
    vertex(0, -rhombusW);
    vertex(rhombusH, 0);
    endShape(CLOSE);
    popMatrix();
  }
  endRecord();
}

Simple shape of rotated rhombus & ellipse when saved as svg & again when imported back shows angle distortion of rhombus.

// displaying svg shape
import processing.svg.*;

PShape shape;

void setup() {
  size(800, 800);
  shape = loadShape("SHAPE.svg");
}

void draw() {
      shape(shape,0,0);
}
2

Hello,

This is my initial exploration of this…

I got it to work with an example from SVG Export:
https://processing.org/reference/libraries/

Update:
In the code below I used beginRaw() \ endRaw() in place of beginRecord() \EndRecord(). There is a discussion about this in the link above and it is in the references.

////https://processing.org/reference/libraries/svg/index.html

import processing.svg.*;

boolean record = false;;
boolean svgReady = false;
PShape s;

void setup() 
  {
  size(800, 800, P2D); 
  
  beginRaw(SVG, "output.svg");
  // Do all your drawing here
  background(255, 0, 0);
  stroke(0, 255, 0);
  for (int i = 0; i<=8; i++)
    {
   push();
    translate(width/2, height/2);
    rotate(i*TAU/8);
    translate(200, 0);
    noStroke();
    fill(255, 255, 0);
    rhombus();
   pop();
    }    
   endRaw();    
   
   s = loadShape("output.svg");
  }

void draw() 
  {
  background(0);
  shape(s, 0, 0);
  }

  
void rhombus()
  {
  float rhombusW;
  float rhombusH;
  
  rhombusH = 50;
  rhombusW = 50*0.5; 
  
  beginShape();   
  vertex(0, rhombusW);
  vertex(-rhombusH, 0);
  vertex(0, -rhombusW);
  vertex(rhombusH, 0);
  endShape(CLOSE);     
  }

I did not have any success with your code and ventured off in another direction.

image
image802×832 4.41 KB

:slight_smile:

3

Hello again…

The SVG shapes created in your original code displayed fine with other viewers and browsers but not in Processing. I had a similar experience here with some of the shapes I was creating using translate and rotate.

I ended up replacing your shape with a shape using PVectors to rotate and translate the vertices and that worked.

PVector v1, v2, v3, v4;

void shape2()
  {
  v1 = new PVector(0, 0);
  v2 = new PVector(0, 0);
  v3 = new PVector(0, 0);
  v4 = new PVector(0, 0);    
    
  for (int i = 0; i<=8; i++)
    {
    noStroke();
    fill(255, 0, 255);
   
    float x = 50;
    float y = 25;
  
    beginShape();   
    v1.set(0, y); v1.add(100, 0); v1.rotate(i*TAU/8); 
    vertex(v1.x, v1.y);
    v2.set(-x, 0); v2.add(100, 0); v2.rotate(i*TAU/8); 
    vertex(v2.x, v2.y);
    v3.set(0, -y); v3.add(100, 0); v3.rotate(i*TAU/8);
    vertex(v3.x, v3.y);
    v4.set(x, 0); v4.add(100, 0); v4.rotate(i*TAU/8);
    vertex(v4.x, v4.y);
    endShape(CLOSE);    
    } 
  }

I know understand SVGs a lot better!
It is interesting to look at the SVG file that is generated; they are very different depending on how you create the shape.

My test code output:

image
image802×827 9.8 KB

Upper left is the problem one.
:slight_smile:

4

@glv Thanks. I am reusing the svg in another code so svg is required in my case. I had a similar issue in earlier posts with svg in image. The problem lies in how it reads XML file. I guess svgs don’t work well with rotate so specifying co-ordinates is the only option for now:)

1 Like
5

I had learned a lot along the way and wanted to try your original code with beginRaw() and endRaw().

Your original code will generate an SVG without distortion using beginRaw() and endRaw().
The ellipse adds a lot of data!

This is the SVG with ellipse:

ellipse(0,0,ellipseR2,ellipseR2);

Summary 

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN'
          'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>
<svg xmlns:xlink="http://www.w3.org/1999/xlink" style="fill-opacity:1; color-rendering:auto; color-interpolation:auto; text-rendering:auto; stroke:black; stroke-linecap:square; stroke-miterlimit:10; shape-rendering:auto; stroke-opacity:1; fill:black; stroke-dasharray:none; font-weight:normal; stroke-width:1; font-family:'Dialog'; font-style:normal; stroke-linejoin:miter; font-size:12px; stroke-dashoffset:0; image-rendering:auto;" width="800" height="800" xmlns="http://www.w3.org/2000/svg"
><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"
  /><g
  ><g style="stroke-linecap:round; fill:red; stroke:red;"
    ><path style="stroke:none;" d="M400 400 L575 400 L574.9401 404.581 Z"
    /></g
    ><g style="stroke-linecap:round; fill:red; stroke:red;"
    ><path style="stroke:none;" d="M400 400 L574.9401 404.581 L574.6736 410.6835 Z"
      /><path style="stroke:none;" d="M400 400 L574.6736 410.6835 L574.3341 415.2523 Z"
      /><path style="stroke:none;" d="M400 400 L574.3341 415.2523 L573.6956 421.3271 Z"
      /><path style="stroke:none;" d="M400 400 L573.6956 421.3271 L572.8455 427.376 Z"
      /><path style="stroke:none;" d="M400 400 L572.8455 427.376 L572.0696 431.8912 Z"
      /><path style="stroke:none;" d="M400 400 L572.0696 431.8912 L570.8518 437.8769 Z"
      /><path style="stroke:none;" d="M400 400 L570.8518 437.8769 L569.8018 442.3363 Z"
      /><path style="stroke:none;" d="M400 400 L569.8018 442.3363 L568.2208 448.2365 Z"
      /><path style="stroke:none;" d="M400 400 L568.2208 448.2365 L566.4349 454.078 Z"
      /><path style="stroke:none;" d="M400 400 L566.4349 454.078 L564.9622 458.4162 Z"
      /><path style="stroke:none;" d="M400 400 L564.9622 458.4162 L562.8231 464.1377 Z"
      /><path style="stroke:none;" d="M400 400 L562.8231 464.1377 L561.0884 468.3779 Z"
      /><path style="stroke:none;" d="M400 400 L561.0884 468.3779 L558.6039 473.9582 Z"
      /><path style="stroke:none;" d="M400 400 L558.6039 473.9582 L556.6135 478.0846 Z"
      /><path style="stroke:none;" d="M400 400 L556.6135 478.0846 L553.793 483.5028 Z"
      /><path style="stroke:none;" d="M400 400 L553.793 483.5028 L550.785 488.8192 Z"
      /><path style="stroke:none;" d="M400 400 L550.785 488.8192 L548.4084 492.7359 Z"
      /><path style="stroke:none;" d="M400 400 L548.4084 492.7359 L545.0816 497.8588 Z"
      /><path style="stroke:none;" d="M400 400 L545.0816 497.8588 L542.4702 501.623 Z"
      /><path style="stroke:none;" d="M400 400 L542.4702 501.623 L538.8369 506.5332 Z"
      /><path style="stroke:none;" d="M400 400 L538.8369 506.5332 L535.0343 511.3137 Z"
      /><path style="stroke:none;" d="M400 400 L535.0343 511.3137 L532.0742 514.8103 Z"
      /><path style="stroke:none;" d="M400 400 L532.0742 514.8103 L527.9869 519.3497 Z"
      /><path style="stroke:none;" d="M400 400 L527.9869 519.3497 L524.8188 522.6591 Z"
      /><path style="stroke:none;" d="M400 400 L524.8188 522.6591 L520.462 526.9405 Z"
      /><path style="stroke:none;" d="M400 400 L520.462 526.9405 L515.9585 531.0673 Z"
      /><path style="stroke:none;" d="M400 400 L515.9585 531.0673 L512.4879 534.0577 Z"
      /><path style="stroke:none;" d="M400 400 L512.4879 534.0577 L507.7407 537.9019 Z"
      /><path style="stroke:none;" d="M400 400 L507.7407 537.9019 L504.094 540.6749 Z"
      /><path style="stroke:none;" d="M400 400 L504.094 540.6749 L499.1211 544.222 Z"
      /><path style="stroke:none;" d="M400 400 L499.1211 544.222 L494.0274 547.5935 Z"
      /><path style="stroke:none;" d="M400 400 L494.0274 547.5935 L490.1317 550.0043 Z"
      /><path style="stroke:none;" d="M400 400 L490.1317 550.0043 L484.8417 553.0585 Z"
      /><path style="stroke:none;" d="M400 400 L484.8417 553.0585 L480.806 555.2269 Z"
      /><path style="stroke:none;" d="M400 400 L480.806 555.2269 L475.3394 557.9524 Z"
      /><path style="stroke:none;" d="M400 400 L475.3394 557.9524 L469.7811 560.4855 Z"
      /><path style="stroke:none;" d="M400 400 L469.7811 560.4855 L465.5562 562.2572 Z"
      /><path style="stroke:none;" d="M400 400 L465.5562 562.2572 L459.8535 564.4462 Z"
      /><path style="stroke:none;" d="M400 400 L459.8535 564.4462 L455.5283 565.9567 Z"
      /><path style="stroke:none;" d="M400 400 L455.5283 565.9567 L449.7027 567.7935 Z"
      /><path style="stroke:none;" d="M400 400 L449.7027 567.7935 L443.8165 569.4258 Z"
      /><path style="stroke:none;" d="M400 400 L443.8165 569.4258 L439.3664 570.5148 Z"
      /><path style="stroke:none;" d="M400 400 L439.3664 570.5148 L433.3916 571.7848 Z"
      /><path style="stroke:none;" d="M400 400 L433.3916 571.7848 L427.376 572.8455 Z"
      /><path style="stroke:none;" d="M400 400 L427.376 572.8455 L422.8421 573.5028 Z"
      /><path style="stroke:none;" d="M400 400 L422.8421 573.5028 L416.773 574.1943 Z"
      /><path style="stroke:none;" d="M400 400 L416.773 574.1943 L412.2074 574.5737 Z"
      /><path style="stroke:none;" d="M400 400 L412.2074 574.5737 L406.1074 574.8934 Z"
      /><path style="stroke:none;" d="M400 400 L406.1074 574.8934 L400 575 Z"
      /><path style="stroke:none;" d="M400 400 L400 575 L395.419 574.9401 Z"
      /><path style="stroke:none;" d="M400 400 L395.419 574.9401 L389.3165 574.6736 Z"
      /><path style="stroke:none;" d="M400 400 L389.3165 574.6736 L384.7477 574.3341 Z"
      /><path style="stroke:none;" d="M400 400 L384.7477 574.3341 L378.6729 573.6956 Z"
      /><path style="stroke:none;" d="M400 400 L378.6729 573.6956 L372.6239 572.8455 Z"
      /><path style="stroke:none;" d="M400 400 L372.6239 572.8455 L368.1088 572.0696 Z"
      /><path style="stroke:none;" d="M400 400 L368.1088 572.0696 L362.123 570.8518 Z"
      /><path style="stroke:none;" d="M400 400 L362.123 570.8518 L357.6637 569.8018 Z"
      /><path style="stroke:none;" d="M400 400 L357.6637 569.8018 L351.7634 568.2208 Z"
      /><path style="stroke:none;" d="M400 400 L351.7634 568.2208 L345.922 566.4349 Z"
      /><path style="stroke:none;" d="M400 400 L345.922 566.4349 L341.5838 564.9623 Z"
      /><path style="stroke:none;" d="M400 400 L341.5838 564.9623 L335.8623 562.8231 Z"
      /><path style="stroke:none;" d="M400 400 L335.8623 562.8231 L331.622 561.0884 Z"
      /><path style="stroke:none;" d="M400 400 L331.622 561.0884 L326.0418 558.6039 Z"
      /><path style="stroke:none;" d="M400 400 L326.0418 558.6039 L320.5517 555.9261 Z"
      /><path style="stroke:none;" d="M400 400 L320.5517 555.9261 L316.4972 553.793 Z"
      /><path style="stroke:none;" d="M400 400 L316.4972 553.793 L311.1808 550.785 Z"
      /><path style="stroke:none;" d="M400 400 L311.1808 550.785 L307.2641 548.4084 Z"
      /><path style="stroke:none;" d="M400 400 L307.2641 548.4084 L302.1412 545.0816 Z"
      /><path style="stroke:none;" d="M400 400 L302.1412 545.0816 L297.1376 541.578 Z"
      /><path style="stroke:none;" d="M400 400 L297.1376 541.578 L293.4667 538.8369 Z"
      /><path style="stroke:none;" d="M400 400 L293.4667 538.8369 L288.6863 535.0343 Z"
      /><path style="stroke:none;" d="M400 400 L288.6863 535.0343 L285.1897 532.0742 Z"
      /><path style="stroke:none;" d="M400 400 L285.1897 532.0742 L280.6503 527.9868 Z"
      /><path style="stroke:none;" d="M400 400 L280.6503 527.9868 L276.2563 523.7437 Z"
      /><path style="stroke:none;" d="M400 400 L276.2563 523.7437 L273.0594 520.462 Z"
      /><path style="stroke:none;" d="M400 400 L273.0594 520.462 L268.9327 515.9585 Z"
      /><path style="stroke:none;" d="M400 400 L268.9327 515.9585 L265.9422 512.4879 Z"
      /><path style="stroke:none;" d="M400 400 L265.9422 512.4879 L262.0981 507.7407 Z"
      /><path style="stroke:none;" d="M400 400 L262.0981 507.7407 L258.422 502.8624 Z"
      /><path style="stroke:none;" d="M400 400 L258.422 502.8624 L255.7779 499.1211 Z"
      /><path style="stroke:none;" d="M400 400 L255.7779 499.1211 L252.4065 494.0274 Z"
      /><path style="stroke:none;" d="M400 400 L252.4065 494.0274 L249.9957 490.1317 Z"
      /><path style="stroke:none;" d="M400 400 L249.9957 490.1317 L246.9415 484.8417 Z"
      /><path style="stroke:none;" d="M400 400 L246.9415 484.8417 L244.0739 479.4484 Z"
      /><path style="stroke:none;" d="M400 400 L244.0739 479.4484 L242.0476 475.3394 Z"
      /><path style="stroke:none;" d="M400 400 L242.0476 475.3394 L239.5145 469.7811 Z"
      /><path style="stroke:none;" d="M400 400 L239.5145 469.7811 L237.7428 465.5562 Z"
      /><path style="stroke:none;" d="M400 400 L237.7428 465.5562 L235.5538 459.8535 Z"
      /><path style="stroke:none;" d="M400 400 L235.5538 459.8535 L233.5651 454.078 Z"
      /><path style="stroke:none;" d="M400 400 L233.5651 454.078 L232.2065 449.7026 Z"
      /><path style="stroke:none;" d="M400 400 L232.2065 449.7026 L230.5742 443.8165 Z"
      /><path style="stroke:none;" d="M400 400 L230.5742 443.8165 L229.4852 439.3664 Z"
      /><path style="stroke:none;" d="M400 400 L229.4852 439.3664 L228.2152 433.3916 Z"
      /><path style="stroke:none;" d="M400 400 L228.2152 433.3916 L227.1545 427.376 Z"
      /><path style="stroke:none;" d="M400 400 L227.1545 427.376 L226.4971 422.8421 Z"
      /><path style="stroke:none;" d="M400 400 L226.4971 422.8421 L225.8057 416.773 Z"
      /><path style="stroke:none;" d="M400 400 L225.8057 416.773 L225.4263 412.2074 Z"
      /><path style="stroke:none;" d="M400 400 L225.4263 412.2074 L225.1066 406.1074 Z"
      /><path style="stroke:none;" d="M400 400 L225.1066 406.1074 L225 399.9999 Z"
      /><path style="stroke:none;" d="M400 400 L225 399.9999 L225.06 395.419 Z"
      /><path style="stroke:none;" d="M400 400 L225.06 395.419 L225.3264 389.3165 Z"
      /><path style="stroke:none;" d="M400 400 L225.3264 389.3165 L225.6659 384.7477 Z"
      /><path style="stroke:none;" d="M400 400 L225.6659 384.7477 L226.3044 378.6729 Z"
      /><path style="stroke:none;" d="M400 400 L226.3044 378.6729 L227.1545 372.624 Z"
      /><path style="stroke:none;" d="M400 400 L227.1545 372.624 L227.9304 368.1088 Z"
      /><path style="stroke:none;" d="M400 400 L227.9304 368.1088 L229.1482 362.123 Z"
      /><path style="stroke:none;" d="M400 400 L229.1482 362.123 L230.1982 357.6637 Z"
      /><path style="stroke:none;" d="M400 400 L230.1982 357.6637 L231.7792 351.7635 Z"
      /><path style="stroke:none;" d="M400 400 L231.7792 351.7635 L233.5651 345.922 Z"
      /><path style="stroke:none;" d="M400 400 L233.5651 345.922 L235.0377 341.5838 Z"
      /><path style="stroke:none;" d="M400 400 L235.0377 341.5838 L237.1769 335.8623 Z"
      /><path style="stroke:none;" d="M400 400 L237.1769 335.8623 L238.9117 331.622 Z"
      /><path style="stroke:none;" d="M400 400 L238.9117 331.622 L241.3961 326.0418 Z"
      /><path style="stroke:none;" d="M400 400 L241.3961 326.0418 L244.0738 320.5516 Z"
      /><path style="stroke:none;" d="M400 400 L244.0738 320.5516 L246.207 316.4972 Z"
      /><path style="stroke:none;" d="M400 400 L246.207 316.4972 L249.2149 311.1808 Z"
      /><path style="stroke:none;" d="M400 400 L249.2149 311.1808 L251.5916 307.2641 Z"
      /><path style="stroke:none;" d="M400 400 L251.5916 307.2641 L254.9184 302.1412 Z"
      /><path style="stroke:none;" d="M400 400 L254.9184 302.1412 L258.422 297.1376 Z"
      /><path style="stroke:none;" d="M400 400 L258.422 297.1376 L261.1631 293.4668 Z"
      /><path style="stroke:none;" d="M400 400 L261.1631 293.4668 L264.9657 288.6863 Z"
      /><path style="stroke:none;" d="M400 400 L264.9657 288.6863 L267.9258 285.1896 Z"
      /><path style="stroke:none;" d="M400 400 L267.9258 285.1896 L272.0131 280.6503 Z"
      /><path style="stroke:none;" d="M400 400 L272.0131 280.6503 L276.2563 276.2563 Z"
      /><path style="stroke:none;" d="M400 400 L276.2563 276.2563 L279.538 273.0594 Z"
      /><path style="stroke:none;" d="M400 400 L279.538 273.0594 L284.0415 268.9327 Z"
      /><path style="stroke:none;" d="M400 400 L284.0415 268.9327 L287.5121 265.9422 Z"
      /><path style="stroke:none;" d="M400 400 L287.5121 265.9422 L292.2592 262.0981 Z"
      /><path style="stroke:none;" d="M400 400 L292.2592 262.0981 L297.1375 258.4221 Z"
      /><path style="stroke:none;" d="M400 400 L297.1375 258.4221 L300.8789 255.778 Z"
      /><path style="stroke:none;" d="M400 400 L300.8789 255.778 L305.9726 252.4065 Z"
      /><path style="stroke:none;" d="M400 400 L305.9726 252.4065 L309.8683 249.9957 Z"
      /><path style="stroke:none;" d="M400 400 L309.8683 249.9957 L315.1583 246.9416 Z"
      /><path style="stroke:none;" d="M400 400 L315.1583 246.9416 L320.5516 244.0739 Z"
      /><path style="stroke:none;" d="M400 400 L320.5516 244.0739 L324.6606 242.0475 Z"
      /><path style="stroke:none;" d="M400 400 L324.6606 242.0475 L330.2189 239.5145 Z"
      /><path style="stroke:none;" d="M400 400 L330.2189 239.5145 L334.4438 237.7428 Z"
      /><path style="stroke:none;" d="M400 400 L334.4438 237.7428 L340.1465 235.5538 Z"
      /><path style="stroke:none;" d="M400 400 L340.1465 235.5538 L345.922 233.5651 Z"
      /><path style="stroke:none;" d="M400 400 L345.922 233.5651 L350.2973 232.2065 Z"
      /><path style="stroke:none;" d="M400 400 L350.2973 232.2065 L356.1835 230.5742 Z"
      /><path style="stroke:none;" d="M400 400 L356.1835 230.5742 L360.6335 229.4852 Z"
      /><path style="stroke:none;" d="M400 400 L360.6335 229.4852 L366.6085 228.2152 Z"
      /><path style="stroke:none;" d="M400 400 L366.6085 228.2152 L372.6239 227.1545 Z"
      /><path style="stroke:none;" d="M400 400 L372.6239 227.1545 L377.1579 226.4972 Z"
      /><path style="stroke:none;" d="M400 400 L377.1579 226.4972 L383.227 225.8057 Z"
      /><path style="stroke:none;" d="M400 400 L383.227 225.8057 L387.7926 225.4263 Z"
      /><path style="stroke:none;" d="M400 400 L387.7926 225.4263 L393.8925 225.1066 Z"
      /><path style="stroke:none;" d="M400 400 L393.8925 225.1066 L400 225 Z"
      /><path style="stroke:none;" d="M400 400 L400 225 L404.5809 225.06 Z"
      /><path style="stroke:none;" d="M400 400 L404.5809 225.06 L410.6835 225.3264 Z"
      /><path style="stroke:none;" d="M400 400 L410.6835 225.3264 L415.2523 225.666 Z"
      /><path style="stroke:none;" d="M400 400 L415.2523 225.666 L421.3271 226.3044 Z"
      /><path style="stroke:none;" d="M400 400 L421.3271 226.3044 L427.376 227.1545 Z"
      /><path style="stroke:none;" d="M400 400 L427.376 227.1545 L431.8912 227.9304 Z"
      /><path style="stroke:none;" d="M400 400 L431.8912 227.9304 L437.8769 229.1482 Z"
      /><path style="stroke:none;" d="M400 400 L437.8769 229.1482 L442.3363 230.1982 Z"
      /><path style="stroke:none;" d="M400 400 L442.3363 230.1982 L448.2365 231.7792 Z"
      /><path style="stroke:none;" d="M400 400 L448.2365 231.7792 L454.078 233.5651 Z"
      /><path style="stroke:none;" d="M400 400 L454.078 233.5651 L458.4162 235.0377 Z"
      /><path style="stroke:none;" d="M400 400 L458.4162 235.0377 L464.1377 237.1769 Z"
      /><path style="stroke:none;" d="M400 400 L464.1377 237.1769 L468.378 238.9116 Z"
      /><path style="stroke:none;" d="M400 400 L468.378 238.9116 L473.9582 241.3961 Z"
      /><path style="stroke:none;" d="M400 400 L473.9582 241.3961 L479.4483 244.0738 Z"
      /><path style="stroke:none;" d="M400 400 L479.4483 244.0738 L483.5028 246.207 Z"
      /><path style="stroke:none;" d="M400 400 L483.5028 246.207 L488.8192 249.2148 Z"
      /><path style="stroke:none;" d="M400 400 L488.8192 249.2148 L492.7359 251.5916 Z"
      /><path style="stroke:none;" d="M400 400 L492.7359 251.5916 L497.8588 254.9184 Z"
      /><path style="stroke:none;" d="M400 400 L497.8588 254.9184 L501.623 257.5298 Z"
      /><path style="stroke:none;" d="M400 400 L501.623 257.5298 L506.5332 261.1631 Z"
      /><path style="stroke:none;" d="M400 400 L506.5332 261.1631 L511.3137 264.9657 Z"
      /><path style="stroke:none;" d="M400 400 L511.3137 264.9657 L514.8103 267.9258 Z"
      /><path style="stroke:none;" d="M400 400 L514.8103 267.9258 L519.3497 272.0131 Z"
      /><path style="stroke:none;" d="M400 400 L519.3497 272.0131 L522.6591 275.1812 Z"
      /><path style="stroke:none;" d="M400 400 L522.6591 275.1812 L526.9406 279.538 Z"
      /><path style="stroke:none;" d="M400 400 L526.9406 279.538 L531.0672 284.0415 Z"
      /><path style="stroke:none;" d="M400 400 L531.0672 284.0415 L534.0577 287.5121 Z"
      /><path style="stroke:none;" d="M400 400 L534.0577 287.5121 L537.9019 292.2592 Z"
      /><path style="stroke:none;" d="M400 400 L537.9019 292.2592 L540.6749 295.906 Z"
      /><path style="stroke:none;" d="M400 400 L540.6749 295.906 L544.222 300.8788 Z"
      /><path style="stroke:none;" d="M400 400 L544.222 300.8788 L547.5935 305.9726 Z"
      /><path style="stroke:none;" d="M400 400 L547.5935 305.9726 L550.0043 309.8683 Z"
      /><path style="stroke:none;" d="M400 400 L550.0043 309.8683 L553.0585 315.1584 Z"
      /><path style="stroke:none;" d="M400 400 L553.0585 315.1584 L555.2269 319.194 Z"
      /><path style="stroke:none;" d="M400 400 L555.2269 319.194 L557.9523 324.6605 Z"
      /><path style="stroke:none;" d="M400 400 L557.9523 324.6605 L560.4855 330.2189 Z"
      /><path style="stroke:none;" d="M400 400 L560.4855 330.2189 L562.2572 334.4438 Z"
      /><path style="stroke:none;" d="M400 400 L562.2572 334.4438 L564.4462 340.1465 Z"
      /><path style="stroke:none;" d="M400 400 L564.4462 340.1465 L565.9567 344.4717 Z"
      /><path style="stroke:none;" d="M400 400 L565.9567 344.4717 L567.7935 350.2973 Z"
      /><path style="stroke:none;" d="M400 400 L567.7935 350.2973 L569.4258 356.1835 Z"
      /><path style="stroke:none;" d="M400 400 L569.4258 356.1835 L570.5148 360.6336 Z"
      /><path style="stroke:none;" d="M400 400 L570.5148 360.6336 L571.7848 366.6084 Z"
      /><path style="stroke:none;" d="M400 400 L571.7848 366.6084 L572.6 371.1167 Z"
      /><path style="stroke:none;" d="M400 400 L572.6 371.1167 L573.5029 377.1579 Z"
      /><path style="stroke:none;" d="M400 400 L573.5029 377.1579 L574.1943 383.227 Z"
      /><path style="stroke:none;" d="M400 400 L574.1943 383.227 L574.5737 387.7926 Z"
      /><path style="stroke:none;" d="M400 400 L574.5737 387.7926 L574.8934 393.8926 Z"
      /><path style="stroke:none;" d="M400 400 L574.8934 393.8926 L575 400 Z"
      /><path style="stroke:none;" d="M578.9949 744.7487 L523.7437 523.7437 L744.7487 578.9949 Z"
      /><path style="stroke:none;" d="M578.9949 744.7487 L744.7487 578.9949 L800 800 Z"
      /><path style="stroke:none;" d="M55.2513 578.9949 L276.2563 523.7437 L221.0051 744.7487 Z"
      /><path style="stroke:none;" d="M55.2513 578.9949 L221.0051 744.7487 L0 800 Z"
      /><path style="stroke:none;" d="M221.005 55.2513 L276.2563 276.2563 L55.2513 221.0051 Z"
      /><path style="stroke:none;" d="M221.005 55.2513 L55.2513 221.0051 L0 0 Z"
      /><path style="stroke:none;" d="M744.7487 221.005 L523.7437 276.2563 L578.9949 55.2512 Z"
      /><path style="stroke:none;" d="M744.7487 221.005 L578.9949 55.2512 L799.9999 0 Z"
    /></g
  ></g
></svg
>

This is the SVG without ellipse:

//ellipse(0,0,ellipseR2,ellipseR2);

Summary 
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN'
          'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>
<svg xmlns:xlink="http://www.w3.org/1999/xlink" style="fill-opacity:1; color-rendering:auto; color-interpolation:auto; text-rendering:auto; stroke:black; stroke-linecap:square; stroke-miterlimit:10; shape-rendering:auto; stroke-opacity:1; fill:black; stroke-dasharray:none; font-weight:normal; stroke-width:1; font-family:'Dialog'; font-style:normal; stroke-linejoin:miter; font-size:12px; stroke-dashoffset:0; image-rendering:auto;" width="800" height="800" xmlns="http://www.w3.org/2000/svg"
><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"
  /><g
  ><g style="stroke-linecap:round; fill:red; stroke:red;"
    ><path style="stroke:none;" d="M578.9949 744.7487 L523.7437 523.7437 L744.7487 578.9949 Z"
    /></g
    ><g style="stroke-linecap:round; fill:red; stroke:red;"
    ><path style="stroke:none;" d="M578.9949 744.7487 L744.7487 578.9949 L800 800 Z"
      /><path style="stroke:none;" d="M55.2513 578.9949 L276.2563 523.7437 L221.0051 744.7487 Z"
      /><path style="stroke:none;" d="M55.2513 578.9949 L221.0051 744.7487 L0 800 Z"
      /><path style="stroke:none;" d="M221.005 55.2513 L276.2563 276.2563 L55.2513 221.0051 Z"
      /><path style="stroke:none;" d="M221.005 55.2513 L55.2513 221.0051 L0 0 Z"
      /><path style="stroke:none;" d="M744.7487 221.005 L523.7437 276.2563 L578.9949 55.2512 Z"
      /><path style="stroke:none;" d="M744.7487 221.005 L578.9949 55.2512 L799.9999 0 Z"
    /></g
  ></g
></svg
>

:slight_smile: