generate texture from svg content instead of svg path

[freddyInKorea]

Hello everybody,

First of all, thank you for providing such a great framework. here is my question: is it possible to generate a texture from the content of a SVG file instead of its path. I found an issue talking about it: 

https://github.com/pixijs/pixi.js/issues/2927

http://https://codepen.io/RanzQ/pen/RGPrxr

var texture = PIXI.Texture.fromImage('data:image/svg+xml;charset=utf8,' + serializedSvg)

but it seems that the given solution doesn't work anymore. I tried it in my project and it doesn't display anything.

thank you for your helps.

[freddyInKorea]

I found out a solution from this website:

https://medium.com/@benjamin.black/using-blob-from-svg-text-as-image-source-2a8947af7a8e

const blob = new Blob([svgObject], {type: 'image/svg+xml'});
const url = URL.createObjectURL(blob);
PIXI.Texture.fromImage(url,undefined,undefined,2);

 

Unfortunately, when I zoom in now the quality is quite low do you have any idea which may provoke that?

<svg version="1.0" id="blop_1" x="0px" y="0px" width="800px" height="800px"
	 viewBox="0 0 800 800" style="enable-background:new 0 0 800 800;" xml:space="preserve">
  <circle cx="400" cy="400" r="400" stroke="black" stroke-width="3" fill="red" />
</svg>

 

Thank you for your helps

EDIT:

FIREFOX : doesn't display

EDGE: no quality loss when zoom in

CHROME: quality loss when zoom in

it's quite strange

[ivan.popelyshev]

Any chance this can help you? https://github.com/bigtimebuddy/pixi-svg

[freddyInKorea]

Looks great but it seems this lib doesn't support a lot of SVG features.

It's ok, I think I will just create all svg files in my solution, however it would have been awesome to change svg properties during runtime. I made a SVG tank, and I wished to set tank's color by editing this SVG during runtime. Let's wait the next PIXI JS version to see if this feature will be available. ?

[ivan.popelyshev]

It wont be available because I remember people who needed this fixed and were saying same thing like you: i'll wait for next version. This part of PixiJS still waits for its hero.

I work on SWF support, its close to SVG, but I think it'll be another 6 or 12 months before i start work on SVG improvements.

Without extra input on the issue, demos about it, explanations why current version is wrong - nothing will be done.

[freddyInKorea]

well, it's a little bit inconvenient but it's far from being a blocking point. thank you for this framework and thank you for the work you have done