OpenGL in 2.0.3 mess up SVG render

andres

Re: OpenGL in 2.0.3 mess up SVG render

1 month ago

Hello, I haven't seen any issues with the rendering of SVG files with P2D or P3D. Could you describe the problems you have found in more detail, or even better still, post a code example including the SVG?

voices

Re: OpenGL in 2.0.3 mess up SVG render

1 month ago

it is a simple flocking sketch, i load the svg with

PShape api;
api=loadShape("ape.svg");

and render the boid with

void render() {
float theta = velocity.heading2D() + radians(90);
fill(175);
stroke(0);
pushMatrix();
translate(location.x,location.y);
rotate(theta);
scale(0.2);
shapeMode(CENTER);
shape(api,0,0);
popMatrix();
}

it render with P2D and worked until the 2.0.3

now the shape render correctly only in the default render mode, in P2D and P3D some shape of the SVG are misplaced

here the svg code

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="86.56px" height="116.817px" viewBox="0 0 86.56 116.817" enable-background="new 0 0 86.56 116.817" xml:space="preserve">
<g>
<g>
<ellipse fill="#E2C700" cx="42.737" cy="43.442" rx="19.875" ry="16.125"/>
<ellipse fill="#E2C700" cx="42.862" cy="77.567" rx="19" ry="39.25"/>
<path fill="#E2C700" d="M56.887,17.924c1.953,1.953,1.953,5.118,0,7.071L46.272,36.852c-1.953,1.953-5.119,1.953-7.071,0
L28.586,24.995c-1.951-1.952-1.952-5.118,0.001-7.071c0,0,6.037-5.134,13.906-5.134S56.887,17.924,56.887,17.924z"/>
</g>
<path d="M60.915,63.668c-5.709,4.985-31.222,5.413-36.107,0c-0.794-0.88-0.055-3.528,1.172-4.102
c14.632,3.031,19.132,3.031,33.765,0C60.905,60.207,61.844,62.858,60.915,63.668z"/>
<path d="M61.599,75.804c-5.973,5.465-32.662,5.934-37.772,0c-0.831-0.965-0.057-3.868,1.226-4.496
c15.307,3.323,20.015,3.323,35.321,0C61.588,72.008,62.569,74.916,61.599,75.804z"/>
<path d="M61.092,88.268c-5.765,5.188-31.528,5.632-36.461,0c-0.802-0.914-0.056-3.669,1.183-4.266
c14.776,3.153,19.32,3.153,34.097,0C61.083,84.667,62.03,87.426,61.092,88.268z"/>
<path d="M58.405,100.518c-4.961,5.188-27.133,5.632-31.378,0c-0.69-0.914-0.048-3.669,1.019-4.266
c12.716,3.153,16.626,3.153,29.343,0C58.397,96.917,59.212,99.676,58.405,100.518z"/>
<path d="M53.521,110.618c-3.367,4.092-18.417,4.442-21.298,0c-0.469-0.722-0.033-2.895,0.691-3.365
c8.632,2.487,11.285,2.487,19.918,0C53.516,107.777,54.069,109.954,53.521,110.618z"/>
<path d="M52.299,30.54c2.235,0.823,4.858-1.546,5.86-5.292c1.001-3.744,0.002-7.449-2.233-8.271
c-2.234-0.822-1.575,2.414-2.576,6.158C52.347,26.879,50.063,29.716,52.299,30.54z"/>
<path d="M33.424,30.54c-2.234,0.823-4.858-1.546-5.859-5.292c-1.001-3.744-0.002-7.449,2.233-8.271
c2.234-0.822,1.574,2.413,2.576,6.158C33.376,26.878,35.66,29.716,33.424,30.54z"/>
<path opacity="0.7" fill="#CCFFF9" d="M27.675,96.409c0.333,9.735-18.358,24.385-24.333,19.402
c-12.788-10.663,14.557-48.826,24.333-62C34.009,46.145,38.876,83.561,27.675,96.409z"/>
<path opacity="0.7" fill="#CCFFF9" d="M58.884,96.409c-0.333,9.736,18.358,24.385,24.334,19.402
c12.787-10.662-14.558-48.826-24.334-62C52.551,46.145,47.683,83.561,58.884,96.409z"/>
<line fill="none" stroke="#000000" stroke-miterlimit="10" x1="34.373" y1="14.524" x2="32.027" y2="10.15"/>
<path fill="none" stroke="#000000" stroke-miterlimit="10" d="M32.027,10.15c0-2.568,2.346-10,2.346-10"/>
<line fill="none" stroke="#000000" stroke-miterlimit="10" x1="51.014" y1="14.524" x2="53.359" y2="10.15"/>
<path fill="none" stroke="#000000" stroke-miterlimit="10" d="M53.359,10.15c0-2.568-2.346-10-2.346-10"/>
</g>
</svg>

andres

Re: OpenGL in 2.0.3 mess up SVG render

1 month ago

thanks for posting the code, I was able to reproduce the problem and just opened an issue for it on github.

jfavlam

Re: OpenGL in 2.0.3 mess up SVG render

1 month ago

It works for me in P2D, P3D and OPENGL render mode, with this SVG file >

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="86.561px" height="116.816px" viewBox="0 0 86.561 116.816" enable-background="new 0 0 86.561 116.816"
xml:space="preserve">
<path fill="#E2C700" d="M62.612,43.442c0-5.921-3.945-11.082-9.808-13.886l4.083-4.561c1.952-1.953,1.952-5.118,0-7.071
c0,0-6.525-5.134-14.395-5.134s-13.906,5.134-13.906,5.134c-1.953,1.953-1.952,5.119-0.001,7.071l4.083,4.561
c-5.862,2.804-9.807,7.965-9.807,13.886c0,4.021,1.825,7.688,4.824,10.512c-2.399,6.571-3.824,14.748-3.824,23.613
c0,21.678,8.507,39.25,19,39.25s19-17.572,19-39.25c0-8.941-1.45-17.18-3.888-23.78C60.866,50.987,62.612,47.381,62.612,43.442z"/>
<path d="M60.915,63.668c-5.709,4.984-31.222,5.413-36.106,0c-0.794-0.88-0.056-3.528,1.172-4.103
c14.632,3.031,19.132,3.031,33.765,0C60.905,60.207,61.844,62.858,60.915,63.668z"/>
<path d="M61.599,75.804c-5.974,5.465-32.662,5.934-37.772,0c-0.831-0.965-0.057-3.868,1.227-4.496
c15.307,3.323,20.015,3.323,35.32,0C61.588,72.008,62.569,74.916,61.599,75.804z"/>
<path d="M61.092,88.268c-5.765,5.188-31.527,5.632-36.461,0c-0.802-0.914-0.056-3.669,1.184-4.266
c14.775,3.152,19.319,3.152,34.097,0C61.083,84.667,62.03,87.426,61.092,88.268z"/>
<path d="M58.405,100.518c-4.961,5.188-27.133,5.632-31.378,0c-0.69-0.914-0.048-3.669,1.019-4.266
c12.717,3.152,16.626,3.152,29.344,0C58.397,96.917,59.212,99.676,58.405,100.518z"/>
<path d="M53.521,110.618c-3.367,4.092-18.417,4.441-21.298,0c-0.47-0.723-0.033-2.896,0.69-3.365c8.632,2.486,11.285,2.486,19.918,0
C53.516,107.777,54.069,109.954,53.521,110.618z"/>
<path d="M52.299,30.54c2.235,0.822,4.858-1.546,5.86-5.292c1.001-3.744,0.002-7.449-2.233-8.271
c-2.233-0.822-1.574,2.414-2.575,6.158C52.347,26.879,50.063,29.716,52.299,30.54z"/>
<path d="M33.424,30.54c-2.233,0.822-4.857-1.546-5.858-5.292c-1.001-3.744-0.002-7.449,2.232-8.271s1.574,2.413,2.576,6.158
C33.376,26.878,35.66,29.716,33.424,30.54z"/>
<path opacity="0.7" fill="#CCFFF9" enable-background="new " d="M27.675,96.409c0.333,9.734-18.357,24.385-24.333,19.401
c-12.787-10.663,14.558-48.826,24.333-62C34.009,46.145,38.876,83.561,27.675,96.409z"/>
<path opacity="0.7" fill="#CCFFF9" enable-background="new " d="M58.884,96.409c-0.333,9.735,18.358,24.385,24.334,19.401
c12.787-10.662-14.558-48.826-24.334-62C52.551,46.145,47.683,83.561,58.884,96.409z"/>
<rect x="30.718" y="11.837" transform="matrix(0.4726 0.8813 -0.8813 0.4726 28.3813 -22.7519)" width="4.963" height="1"/>
<path d="M32.527,10.15h-1c0-2.614,2.272-9.844,2.369-10.15L34.85,0.3C34.826,0.374,32.527,7.688,32.527,10.15z"/>
<rect x="51.687" y="9.855" transform="matrix(0.8812 0.4728 -0.4728 0.8812 12.0349 -23.2087)" width="1" height="4.963"/>
<path d="M53.859,10.15h-1c0-2.462-2.299-9.776-2.322-9.85l0.953-0.301C51.587,0.305,53.859,7.535,53.859,10.15z"/>
</svg>

I've just cleaned your shapes in Illustrator.

-------------------------------------------------------------------------------

“We shape our tools and thereafter our tools shape us”
- Marshall McLuhan

voices

Re: OpenGL in 2.0.3 mess up SVG render

1 month ago

yep, now it works!

thanks guys!