I am encountering an issue with converting an SVG element generated by D3 into a PNG using dom-to-image within my Angular 2 application. The problem arises when I attempt to set the SVG as the source of an image element, resulting in the SVG code being encoded. How can I directly insert the unencoded string into the src?
Here is the code snippet that illustrates my approach:
var divelem = document.createElement('div');
var imgelem = document.createElement('img');
imgelem.height = 400;
imgelem.width = 300;
imgelem.src = node.outerHTML;
//imgelem.src = decodeURI(imgelem.src)
The node.outerHTML value is as follows:
[SVG code sample]
The current value of imgelem.src after setting it:
[Encoded URL]
Despite attempting to decode it, the URL remains invalid. As a result, I am unsure how to achieve placing the value from node.outerHTML into imgelem.src.
UPDATE:
I have tried directly assigning the SVG string to src, but regardless of what I do, the content gets encoded.
[SVG code sample]