Incorrect display of svg images

[Pirajok168]

What did I do wrong? What should I do to make the svg image display correctly?

I did this: WebImage(url: URL(string: "https://s3-symbol-logo.tradingview.com/apple--big.svg"), context: [.imageThumbnailPixelSize : CGSize(width: 56, height: 56)]) .resizable()

Got this image:

And should have received:

[dreampiggy]

Is that same SVG data ?

I think your request need to mock some HTTP UA. That S3 may return some extra changes based on your UA.

Or, just host the image locally, use URL(fileURLWithPath:) to check behavior again.

https://developer.mozilla.org/en/docs/Web/HTTP/Headers/User-Agent

[Pirajok168]

@dreampiggy Yes, these are the same SVG data. I can't place them locally, as this data comes to me from a request from the server. Another interesting fact is that not all SVG images are displayed incorrectly. Correct images for "SPDR", "Tesla", "HDFC BANK", "Invesco QQQ". The images of the rest of the list items did not load correctly. Example below:

[dreampiggy]

Maybe should move to https://github.com/SDWebImage/SDWebImageSVGCoder ?

I guess this is related to the current CoreSVG's render engine limit by Apple. They only provide the subset SVG support for SF Symbols, but not generic SVG rendering.

Maybe someone who has expert experience should use the official SVG-native standard to re-implements this ?

[dreampiggy]

Currently I guess the best way to solve this is to use PDF vector instead. You can found some best SVG to PDF converter.

Or just simple, use PNG bitmap version of original SVG, draw a big enough (for example, 500x500 pixel size) bitmap version.