Is there a way to convert SVG string to a Skia drawable object without saving it in between?

vvvv gamma question
1

One of the options to get QR Code in QRCoder library can be svg. Very interesting, but I noticed that it seems that without intermediate saving to a file and then loading that file, I can’t display that SVG. Am I right or am I missing something?

skia_svg
skia_svg903×747 50.6 KB

qrcoder3.vl (44.2 KB)

2

Can you show use what you’re feeding to FromSVGPathData?

3

@sebescudie

As far as I can tell it’s pure SVG, by saving it I can get a working SVG file. In general, I have been working with FromSVGPathData and ParseSVGPathData nodes, they parse paths, not the whole file. There are limitations. But to convert a valid SVG string - there is no such way, I think.

<svg version="1.1" baseProfile="full" shape-rendering="crispEdges" width="0" height="0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
<rect x="0" y="0" width="0" height="0" fill="" />
</svg>

I know it’s not perfectly valid SVG, but even hand-written SVG doesn’t work. That’s because it only works with paths and needs a parser. There is a parser in the help.

But there is a node SVGReader. I understand that somewhere in the library itself all the magic happens and the wrapper comes into play.

Screenshot_37
Screenshot_37849×780 12.1 KB

The result is SKPicture. But I would be happy with that.

4

The node expects just the path data, not the entire SVG!

image
image1016×725 13.4 KB

5

yep, I know

Main question: Is there any way to load whole SVG by string, not by file?

6

None that I’m aware of!