# Issue when loading SVG file: Distortion with P2D or P3D renderer

**URL:** <https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190>\
**Category:** Coding Questions\
**Created:** [August 4, 2019, 10:16pm UTC](https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190 "2019-08-04T22:16:25Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![uli-b](https://avatars.discourse-cdn.com/v4/letter/u/7cd45c/32.png) [@uli-b](https://discourse.processing.org/u/uli-b)\
**Post date:** [August 4, 2019, 10:16pm UTC](https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190/1 "2019-08-04T22:16:25Z")

</div>

Hello,

I am using the processing java library as part of my project. Within the project, I like to load svg files and draw them on a pgraphics object. The svg files show icons with some white space around them. This works welll by using the JAVA2D Renderer:

```auto
		PGraphics svglayer = createGraphics(width, height, JAVA2D);
		svglayer.beginDraw();
		PShape svg = loadShape("svg.svg");
		svglayer.shape(svg, 0, 0,width, height);
		svglayer.endDraw();

```

Since I want to include some 3D rotation into my program I now switched to the P3D / opengl renderer. But this now leads to distorted SVG files.

What is very interesting is, that if I call

```auto
svg.width

```

with the JAVA2D renderer, it gives back “800” which ist the original width of the SVG. If I call it with the P3D renderer it gives back a smaller number equivalent to the widest element within the SVG (e.g. 552 for the SVG shown below).

A sample SVG file looks like the followng:

```auto
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.0" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 800 600" style="enable-background:new 0 0 800 600;" xml:space="preserve">
<style type="text/css">
	.st0{fill:#FFFFFF;}
	.st1{fill:#A81D1D;}
</style>
<g>
	<rect x="71.5" y="91.5" class="st0" width="552" height="311"/>
	<path class="st1" d="M623,92v310H72V92H623 M624,91H71v312h553V91L624,91z"/>
</g>
</svg>

```

Is there anything that I might be missing? Thanks and best regards.

Uli

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [August 5, 2019, 3:27am UTC](https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190/2 "2019-08-05T03:27:53Z")

</div>

see  
[https://processing.org/reference/shape\_.html](https://processing.org/reference/shape_.html)  
can you try

```auto
//svglayer.shape(svg, 0, 0,width, height);
svglayer.shape(svg, 0, 0);

```

and report any difference?

---

<div class="post-metadata">

**Author:** ![uli-b](https://avatars.discourse-cdn.com/v4/letter/u/7cd45c/32.png) [@uli-b](https://discourse.processing.org/u/uli-b)\
**Post date:** [August 5, 2019, 7:38am UTC](https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190/3 "2019-08-05T07:38:09Z")

</div>

Hi,

thanks for your reply. This is interesting. If I do not resize the shape it does not get distorted. And

svg.width

does indeed show me the correct width. My issue now still is that I have to resize the SVG. This is no problem when using the JAVA2D renderer. Any ideas to make it work with P3D?

Thanks and regards

Uli

---

<div class="post-metadata">

**Author:** ![uli-b](https://avatars.discourse-cdn.com/v4/letter/u/7cd45c/32.png) [@uli-b](https://discourse.processing.org/u/uli-b)\
**Post date:** [August 7, 2019, 8:37pm UTC](https://discourse.processing.org/t/issue-when-loading-svg-file-distortion-with-p2d-or-p3d-renderer/13190/4 "2019-08-07T20:37:12Z")

</div>

Anybody any idea? Thanks!