Issues in conversion of SVG to PNG

[im-vignesh]

Hello there.

I'm facing the following issues when trying to convert SVG into PNG,

• <path>,<text> tags in SVGs are not being rendered in PNG,
• When the <image> tag in SVG has gifs, imgproxy gives out a empty render with grey background.

I tried to convert to WebP/ Jpeg, but facing the same issue there too. I couldn't find an option to convert to Webp Animated/APNG.

Attaching an example SVG image which has the both the tags described above.

https://metadata.ens.domains/mainnet/0x57f1887a8bf19b14fc0df6fd9b2acc9af147ea85/0xaf2caa1c2ca1d027f1ac823b529d0a67cd144264b2789fa2ea4d63a67c7103cc/image

Thanks.

[DarthSim]

Hi @im-vignesh,

<path>, <text> tags in SVGs are not being rendered in PNG

These elements have the feDropShadow filter applied which is not supported by old versions of librsvg. You can either set IMGPROXY_SVG_FIX_UNSUPPORTED=1 to make imgproxy replace the feDropShadow filter or upgrade imgproxy to the latest release which uses the librsvg version supporting feDropShadow.

When the <image> tag in SVG has gifs, imgproxy gives out a empty render with grey background

I will fix rendering GIFs embedded in SVG, but SVGs can only be rendered as static images.

[im-vignesh]

Hello @DarthSim,

As you suggested, SVG filters issue got resolved by upgrading the imgproxy. Thanks for that.

Is there any other format I can try converting to, so that I will be retaining the animation instead of static image?

[DarthSim]

The latest build contains the fix for rendering of GIFs embedded in SVG.

Is there any other format I can try converting to, so that I will be retaining the animation instead of static image?

As I said before, SVGs can be rendered only to static images. Unlike other image formats, SVG doesn't have a concept of "frame". And since an SVG can have multiple animated objects including ones animated with CSS or JS, proper implementation of rendering animated SVG as a frameset would require enormous effort. I really doubt any SVG rendering library will ever implement this.

So the best way to keep SVG animated is not to rasterize it.