EasyQRCodeJS icon indicating copy to clipboard operation
EasyQRCodeJS copied to clipboard

SVG Logo export to SVG linked file

Open webappvicio opened this issue 3 years ago • 3 comments

I used an SVG logo and exported the QR code to SVG. The current procedure embeds the logo with an tag:

<image width="494.911" height="500" preserveAspectRatio="none" transform="translate(356.045 353.5)" xmlns:ns1="http://www.w3.org/1999/xlink" ns1:href="logo.svg"/>

The output SVG is not compatible in many environments (Adobe Illustrator, MacOS finder preview, github SVG preview, etc..), and if I convert to PDF (in my case with the rsvg-convert library, the nested SVG is rendered by raster pixels, and it's not anymore a vector.

I tried as proof of concept to inline embed the logo SVG inside the output SVG (just adding a tag for positioning and resizing).

<g transform="translate(356.045 353.5) scale(1.27 1.27)"> <svg preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg"> <defs>...

The SVG is now compatible with any application and, when converted to PDF, it keeps its vector features (high resolution, low dimension file).

I would like to know if there is already an option to export to SVG with an embedded SVG logo (perhaps also background). Has this feature make sense for the project of for other users? (perhaps just my singular requirements).

I could eventually try to develop the feature on a fork (even though my coding skills are not so great), Is any guidance or advice before eventually attempting to write the code by myself? 1_qrcode 2_qrcode 1_qrcode.pdf

webappvicio avatar May 11 '22 05:05 webappvicio

Hi @webappvicio, thanks for your research and goog job!

But I'm not a designer and SVG expert. My coding knowledge is limited to the conversion from Canvas to SVG. So I can't give you guidance on SVG as you are more professional than me, but if you know exactly what code you need and need coding customization, I can help.

Looking forward to your results and PR.

ushelp avatar May 13 '22 01:05 ushelp

@EVO-9 I execute a post-process script that embeds the SVG properly in a 100% vector PDF, that works for my endpoint. rsvg-convert --format=pdf qrcode.svg > qrcode.pdf

webappvicio avatar Jul 20 '22 11:07 webappvicio

rsvg-convert is a command in librsvg: https://gitlab.gnome.org/GNOME/librsvg I installed on macOS easily with : brew install librsvg

webappvicio avatar Jul 20 '22 11:07 webappvicio