Images in SVG Image tags not showing up in Chrome, but displays locally?
When you load an SVG into a webpage using an <img> element, the SVG has to be self-contained. It cannot link to third part resources like you are doing by linking to the PNG files. This a privacy restriction imposed by the browser.
Possible solutions are:
Convert your PNG to Data URI format and include them in your SVG that way.
Convert your blocker PNG(s) to actual SVG elements, such as a
<path>.
PaulLeBeau's answer is right. But another solution is to use an embed tag instead of an img tag for the picture.
<embed src="svg.svg">
Here are some ways to embed svg images in HTML.
Another solution that worked for me is, open SVG image in any editor (Vs code or Notepad++) and replace
xlink:href="data:img/png;base64,
to
xlink:href="data:image/png;base64,
img to image.
Hope this helps if someone is still looking for it.