Illustrator shifts embedded image when exporting to SVG

[davidm44952036]

Hi all, I am trying to update my lab's website logo and as part of that I have placed an embedded image into the AI file. (My PI updated the "Q" with some unknown program, because I only have bitmaps of it) It looks great in Illusterator, but, like the title says, when I export it, it moves the embedded image so that it partially lays outside the artboard, which causes massive problems when loading in HTML (it is moving it a lot, not by a pixel or two). I have tried turning off responsive in the SVG dialog, using the "use artboard" option when exporting, (which, BTW, pointlessly adds a -01 to the end of the file when there is only one artboard, requiring manual renaming each time) editing the exported SVG after finishing in Illustrator, and all combinations of the above. I treid vectorizing the image, but in 2021, we're apparently still really, really bad at that (after vectorizing, when you go to export the SVG, or just make it pixel perfect, a TONN of cracks appear all over the image, rendering it unusable). Does anyone have any suggestions? I have added the image below in case that helps. Thank!

[davidm44952036]

Sorry, I made a mistake uploading the file, I uploaded the SVG that demonstrates the misalignment. I just tried to upload the actual AI file, but according to Adobe: "The attachment's logo_transparent.ai content type (application/postscript) does not match its file extension and has been removed." So, I guess Adobe does not know the correct format of Adobe Illustrator files (or otherwise they are very bad at error messages)...

[Ashutosh_Mishra]

Hi there,

Sorry to hear about your experience. In addition to what Jacob has asked, you may share the document using Creative Cloud or any other cloud service you prefer. Just upload the file on drive and share the link with us. Additionally, let us know if you see this behavior in a specific file only. Please share version of OS & Illustrator as well.

This information would help us assist you accordingly.

Regards,

Ashutosh

[davidm44952036]

Thanks! I am running Windows 11 and the latest version of Illustrator.

https://assets.adobe.com/id/urn:aaid:sc:US:ef6bffe0-9842-4e19-a23b-631c20a7a8c6?view=difile

[Ged_Traynor]

Moving thread to the Illustrator forum from Using the Community

[Jacob Bugge]

David,

Maybe a silly question, but are you sure that the SVG artwork is aligned with the Artboard?

[davidm44952036]

Yes, I did not do it at first, but have started. I have realized after playing around with it further that it is actually scaling the image as well. It seems when I have it aligned to the artboard, that acts like an anchor point and doesn't move, but the image is enlarged so that it still falls over the border on the opposite side.

[davidm44952036]

I have realized that it is scaling the image, not simply moving it. Before exporting to SVG, the embedded image is 89x89 points, but after exporting, it is magically made to be 95.55x95.55 points. Does anyone know how that could happen?

[davidm44952036 · Accepted solution]

It appears I have somehow accidently fixed this. I believe the only thing I changed was to upload the AI file to the cloud, but the next time I went to export, it just worked... I have no idea why, but appaerently if you are having any strage problems with AI files, try uploading it to the cloud.

[Jacob Bugge]

Thank you for sharing, David.

I wonder what you make of the mysterious scaling, Ashutosh.

[Pieter239585315f9x]

I am having exactly the same issue. 

I use the following settings when exporting. 

Styling: Presentation Attibutes

Font: SVG

Images: Embed

Object IDs: Layer names

Decimal: 2

No minify

No Responsive

I tried rolling back to previous versions, but it does not help. 

In all cases of exporting the image get a zoom factor on them. 

It happens with images that have been manually scaled in the mother file

[Monika Gause]

Exactly which issue?

Please tell us step by step what is happening.

[Pieter239585315f9x]

I have a file with a vector path overlaying an image. 

The vector path is matching what is on the image. 

Screenshot of mother file:

I then export to SVG with the following settings:

Styling: Presentation Attibutes

Font: SVG

Images: Embed

Object IDs: Layer names

Decimal: 2

No minify

No Responsive

When I open the SVG, the underlying image has been scaled slightly, so that it doesn't match anymore. 

I tested out various Illustrator versions, all with the same result. I found out that when the image is smaller than the artboard, the effect does not appear. What is your recommendation?

[Monika Gause]

A decimal setting of 2 might just be too low.

[Pieter239585315f9x]

At a first glance this seems to work indeed. Thank you!

Would be great if this could be automatically set right, or with the option to choose 'auto'. 

Now I have to guess and check everytime...

[Monika Gause]

There is no "right" and also no "auto"

This option sets the decimal places and thus has an influence on file size. So you have to adjust it to the size of your artwork (larger artwork might need fewer decimal places) and how small you wish file size to be.

[toddd19360779 · Accepted solution]

This fixed my problem with the same issue. Thanks!