external svg is not imported into the png

[ggonmar]

Hi all,

I don't know if this is a problem with this library, or me not calling it properly, but I seem to be unable to obtain the png I expect. I have the following code:

<div id="container" width="64" height="64">
    <svg id="iconSVG" width="64" height="64">
     <image x="0" y="0" width="64" height="64" xlink:href="local.svg" />
      <text x="10" y="60"  style="font-family: Arial;
                 font-size: 15px;
                 stroke: blue;
                 fill: green;">Hello!</text>
     </svg>
</div>
<button id="getPNG" onClick="saveSvgAsPng(document.getElementById('iconSVG'), 'test.png');">
    CONVERT TO PNG
</button>

I expect the png to display the same as the svg is rendering on the browser: the external SVG loaded ('kiwi.svg'), with the line "Hello!" on the bottom. However, I only get the "Hello!" line, without kiwi :(

Any ideas or help I can get will be MUCH appreciated! Thanks

SOLVED: in case someone comes across the same problem, apparently I was falling into a CORS problem trying to load a local svg. One solution is to host the svg in http location. Another, add parameters when launching Chrome: --disable-web-security --user-data-dir="c:/chromedev"