Image uploader not working for images in svg format

Not sure what I’m doing wrong but when I try to upload an image with an svg format it doesn’t work. Can I only upload svg images using the HTML element?

Please help thanks

I’m using SVGs everywhere in my app and they work as expected. How are you uploading it currently?

@andrewgassen I have a group and the group background style is an image. The file i’m trying to upload is an svg image from my desktop. To upload the image i’m clicking on static image which prompts me to select the file

here is the image link, https://s3.amazonaws.com/appforest_uf/f1559469626143x212148495914892480/rydesplit%20lander.svg

it shows up in a web browser but not the editor or preview. Here is a screen shot of the image details

Interesting. I’ve never tried using an svg as a group background. I’ll experiment a bit and see if I can reproduce. Also, have you tried a different svg to see if it has the same behavior?

Andrew, I just created a different test page and tried to do a basic image upload using the picture uploader with a different svg file and still wasn’t able to upload it…

I’m curious how do you upload your svg files?

@andrewgassen let me know if using an svg file as group background works out for you. thanks

Hi @calvin1 I just tried it with an SVG as the image background of a group. It worked without any issues for me. I’m using latest version of Chrome, tested on Macbook Pro and Windows 10

@andrewgassen weird that I can’t get it to work on my end. Can I send you the svg files i’m trying to upload for you to test on your end?

Can also give you access to a test page and you can give it a go…please and thanks

@andrewgassen thanks for your help. I don’t know what is wrong with the svg files i created myself , i just tried with another svg file that wasnt created by me and it worked just fine. Thanks again for trying to help

What tool are you using to create the SVG?

@andrewgassen I’m using adobe photoshop cc 2019.

Another question for you, I’m having issues resizing my images down to mobile. They appear as intended on a wider screen but aren’t scaling down. Any advice on this?

There should be a checkbox for “Keep image proportions as screen resizes” on the floating gray context panel when you’re editing. I believe this will do what you need it to.

Hi Calvin,

Sometimes, this is because of a syntax error in the SVG. Can you open the non-working SVG in a text editor, and see if this line is there:

xlink:href="data:img/png;base64,

If it is, try replacing it with:

xlink:href="data:image/png;base64,

Does that work?

2 Likes

True on my end.

How you save from text editor back into .svg?

May I ask what software or tool do you use for such action? :slight_smile:

I’m not sure what I used here actually, but it might have been Brackets (for Mac).