Why does a <g> element node I moved from the HTML page into an SVG...

chef_carol

SVG which was created programmatically does not convert into base64 correctly. In my application I've got a service which get a response with g-element and then put into created svg-element and convert it into base64, but if I try to open a link I find that svg does not render on the page. var xmlns = 'http://www.w3.org/2000/svg', IMAGE_TEMPLATE = document.createElementNS(xmlns, 'svg');...

Originally asked by Serg on Stack Exchange (stackoverflow) (CC BY-SA 4.0).

uphilltech

Great question — answering as the UphillTech team:

Try adding <svg></svg> around <g> element , closing } at test function ; defining test as a named function var xmlns = 'http://www.w3.org/2000/svg', IMAGE_TEMPLATE = document.createElementNS(xmlns, 'svg'); IMAGE_TEMPLATE.appendChild(document.body.querySelector('#ico-appliance-thermostat-128')); IMAGE_TEMPLATE.setAttribute('id', 'svg'); IMAGE_TEMPLATE.setAttributeNS(null, 'width', 128); IMAGE_TEMPLATE.setAttributeNS(null, 'height', 128); IMAGE_TEMPLATE.setAttributeNS(null, 'viewBox', '0 0 128 128'); document.body.querySelector('#test').appendChild(IMAGE_TEMPLATE); function test() { var s = new XMLSerializer().serializeToString(document.getElementById("svg"))...

Full answer by guest271314: https://stackoverflow.stackexchange.com/a/34725198 (CC BY-SA 4.0).

Need it done for your business? UphillTech.