How to PIXI.resources.SVGResource

[jSwtch]

Hello,

I am trying to use SVGResource (https://pixijs.download/dev/docs/PIXI.resources.SVGResource.html). I hope to get some clarity on the use case and syntax.

app.loader
  .add("svgTest", "./svg/svgTest.svg")
  .load(onLoaded);

function onLoaded(loader, res) {
  
  const svgResourceTest = new PIXI.resources.SVGResource(
    res.svgTest.data
  );
  
  app.stage.addChild(svgResourceTest);
}

I am getting error "Uncaught TypeError: Cannot set property '_parentID' of undefined

I did inspect res.svgTest.data it is just an <img> with src of "./svg/svgTest.svg" - not <svg>

[ivan.popelyshev]

actually, SVGResource is created automatically by loader, with baseTexture and Texture , its inside "res.svgTest.texture.baseTexture.resource"

you can just create a sprite based on it: "new PIXI.Sprite(res.svgTest.texture" - that'll work  

Yes, there are 5 different objects here :

1. sprite - element of the stage tree, like in Adobe Flash.

2. texture - region of baseTexture

3. baseTexture - stores things in videomemory

4. texture resource - DATA that can be uploaded to videomemory, and how exactly to convert it to RGBA

5. raw data from loader

When you get more experience, you'll understand why is it wrapped like that. Basically, if you have some other text vector format (not svg), you can make your own resource that have parsing and uploading algorithm and re-use it for many images.