Better documentation on renderer.generateTexture with SVG resource

In our system, we are trying to cache our SVG assets using the renderer.generateTexture¹.

However, we found that if we call destroy() on the baseTexture and try to regenerate, we got empty sprite. But other part that uses simple Graphics generates texture correctly.

Later we found that it is due to SVG Resource load is asynchronized. The load with auto-load usually works, but we are caching with generateTexture which will need the SVG to be ready. Otherwise it will generate empty texture. https://github.com/pixijs/pixijs/blob/21e780da04f902a8b5d89ccc716daef190c89858/packages/core/src/textures/resources/SVGResource.ts#L81-L101

It might be a good idea to update the documentation for renderer.generateTexture to indicate:

• If using SVG Resource, run with auto-load disabled
• Explicitly await for SVG Resource to be ready
• Then call generateTexture

Here is a snippet:

if (Asset[key].includes('svg')) {
  const svgResource = new SVGResource(Asset[key], { autoLoad: false });
  const resolvedResource = await svgResource.load();
  const baseTexture = new BaseTexture(resolvedResource, {/* config */});
  const texture = new Texture(baseTexture); 
  const sprite = new Sprite(texture);
  // Update sprite property...
  cache[key] = renderer.generateTexture(sprite, { /* config*/ });
}     

---

^{^1} I did not refer the source code due to my system is running 6.4.2, and there are serval updates to the generateTexture code at the time of writing. There are notes saying it will be a breaking change coming to 7.0

[MasonJason23]

Hey @zero41120, Instead of using the code snippet that you provided, have you tried using the PIXI.Texture class? Here is an example code snippet that you can use for your SVG type images.

if (Asset[key].includes('svg')) {
    const texture = Texture.from(Asset[key]);
    var img = new Sprite(texture);
}

[terekite]

Hi @zero41120 , I’m working on this issue with @MasonJason23 and @sunveer2001. we’ve got your code snippet running, how exactly are you destroying and regenerating the base texture you have? Can you share with us another snippet to give us a better idea of what you are trying to do?