CODEWITHSUNDEEP
androidangularjscordovasvgionic-framework
Connor McGill
Connor McGill

Reputation: 269

ionic app does not render svg files in android but does for ios

I'm really new to hybrid web apps and I'm currently trying to build an app that will allow me to display a number of svg files as ion-list items from an ng-repeat. Now I initially had an issue displaying these in my emulator until instead of using an image tag I used a div with an ng-include and a link to the url of the image. This works fine in the Ripple emulator and it also works fine when I'm serving the app via phonegap to an ios device, but for android it doesn't render the images.

Does anyone have any idea why?

Upvotes: 0

Views: 1396

Answers (2)

Liquinaut
Liquinaut

Reputation: 3807

SVG background images referenced in css also didn't show up under ios in my case. But they will render correctly if set as a data attribute inline:

background: url('data:image/svg+xml;utf8,<svg ...> ... </svg>');

More info on the topic here: https://css-tricks.com/probably-dont-base64-svg/

Upvotes: 0

Connor McGill
Connor McGill

Reputation: 269

Thanks to Paul LeBeau for his question, it pointed me in the right direction to solve this issue.

I added the type="image/svg+xml" attribute to a html object element to resolve this issue.

Upvotes: 1

Related Questions