Bitmap images embedded into svg images don't show on iOS

Since a few months ago, I noticed certain images not showing up in various cards in AnkiMobile, with the same cards displaying fine on the PC and AnkiDroid versions of Anki.

This seems to occur specifically when a bitmap image, say a png file is embedded into an svg, with the svg elements showing, but the png not. Such cards come up when creating cards via LaTeX and embedding images with \includegraphics. I can provide an example of an affected card/svg file, unfortunately the forum does not allow uploads with these filetypes.

Today I noticed that curiously, the issue also occurs with AnkiWeb, but only on iOS, i.e. affected cards are fine when viewed via AnkiWeb from a PC. There are reports of Webkit bugs that seem related, e.g. in stackoverflow question #15483215 (can’t link unfortunately), but the reports date back a few years and the bug is claimed to have been fixed. A workaround is also suggested in the responses to the above stackoverflow question, but I am unsure if this can be applied in Anki using the card stylesheet only.

Has anyone already struggled with this issue and maybe found a workaround, apart from just not embedding images via LaTeX?

1 Like

Please let me know an example filename, and I can look it up in your AnkiWeb collection.

Gladly! I made an example card which has an “ID” field with value sbnt-h5a3-kpdj. In the collection.media folder, the associated compiled svg is in the file “latex-31e295fb184a8c8c1b7ec3392f2fde85db3831e2.svg”.

1 Like

I see “testing a figure environment: […diagram…]” on my iOS device, so it seems to be working for me. Tried updating to the latest iOS?

I just updated to iOS 18 with some interesting results: a sizeable fraction of the previously broken cards are now fine (e.g. my previous example), but not all. An example of a card that is still broken has the ID 2ae3162a-21d2-11ee-95ca-810bb46e6eb3, and the problematic svg it embeds (recompiled today) has the filename latex-e42f4e9c9b9e11cb5e7fd77c79fe2f39c1c7458d.svg. Does this card show correctly on your end?

Seems to work for me. I’m guessing you just need to tools>check media on the computer and regenerate all LaTeX, then make sure all media is transferred to AnkiWeb and then your mobile device.

That’s rather strange… Check media reports no missing files, so nothing to regenerate. This is how the card displays (on two different devices running iOS 18):

I only tested with the the latex-e42f4e9c9b9e11cb5e7fd77c79fe2f39c1c7458d.svg in the media folder, but I presume what I’m seeing there is that file.

Yes. In the screenshot you posted, the same issue manifests. The missing image (0bbbfe…) above is for a different field of the same card.

I’m sorry, I misunderstood your earlier post. I understand the problem now. Unfortunately, this does appear to be some change in iOS. I experimented with some changes to the svg file, but I’m afraid I wasn’t able to figure out a workaround that iOS liked.

I see, thanks for looking into it!