JavaScript로 SVG 태그 만들기.

var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttributeNS(null, 'version', '1.1')
svg.setAttribute("xmlns", "http://www.w3.org/2000/svg");
svg.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");

var group = document.createElementNS('http://www.w3.org/2000/svg', 'g');

var circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
circle.setAttributeNS(null, 'cx', 50);
circle.setAttributeNS(null, 'cy', 50);
circle.setAttributeNS(null, 'r', 30);
circle.setAttributeNS(null, 'stroke-width', 2);
circle.setAttributeNS(null, 'fill', 'yellow');

var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
rect.setAttributeNS(null, 'x', 10);
rect.setAttributeNS(null, 'y', 50);
rect.setAttributeNS(null, 'width', 30);
rect.setAttributeNS(null, 'height', 30);
rect.setAttributeNS(null, 'stroke', 'red');
rect.setAttributeNS(null, 'stroke-width', 2);
rect.setAttributeNS(null, 'fill', 'pink');

var image = document.createElementNS('http://www.w3.org/2000/svg', 'image');
image.setAttributeNS(null, 'x', 0);
image.setAttributeNS(null, 'y', 0);
image.setAttributeNS(null, 'width', 81);
image.setAttributeNS(null, 'height', 39);
image.setAttributeNS('http://www.w3.org/1999/xlink', 'href', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAAAnCAYAAAB39KTqAAAAAXNSR0IArs4c6QAABNBJREFUaAXtmr+rXUUQx68iCMFAVKxEcrBI5dNCsRARhLQPm2B9KwuttfX26h9ga2EvCtZpbFUsBAneFNFGiAoiBIL6/cD9wmTdPWfmepUIZ2CYPbvze2fn7LnvbTYrrBlYM7BmYM2AM/CABzP0gtZeEj524LktekN4S3j3MPeC6DfCO4fn/wN5VE6+LHxc+LuQuL4V/ij8U2g404DYhjCXRJL3ufCVofRm88th7ZLoO8L3Bryfav6pwZqnL2vwjPAHTwS61fhd4a9hLg6Zf1X4R5wcjCfNfynE5xF8pgVif0P4nPBZ4Wwitf43IPvshnGn8UXhw0J28HWh1yLVdBfe1GzkG42f7EpvNlcS8tNANk7v9BBtf6hnbFIw0LeFcd1jiqAEKLQwdJqR3mot8hLsHFzVYuRnTIIrcC5m6/hK44eSwiTCctDRhqGul8wHWcjCx2K0MXrGEkxiMP/1JWat7wL/UjA9dU8E+d56by7GhE1O0xKQZMcFpe+ngB4ZBVNCYiLZluPIzwHr5oWy6xVwK8kGBV+0RyVngRZm2fSRZocsxFGpgHc7czzRbTvQCvws5opMtINsFc4kYB2pIz0FgapBehPJQccSxL6GgxzRDHiT388wi4ce7QRAM+2pp9r9FH2L0PaBaVHiOAYSHoPbJdW44c+9FKIqB29bqUqKCg5jWhAVmQKM2KApfeHfAF5CtgHNgPkzvG1/r7anjI0hj3uOHYZSATh1SrgqZdHGUnX5lGRfRLSIqB97/xnY2eiAxzt5carKbI/0Up9jHT+y9qubJNWnBV8jnLyWUq3wkIh/ApUjjQ/7gjFuCdHvpUovqM6zzlVkdI4KWbobjqzG+yU6pwEjTZ11Ni4LbRKPfalk7c3ynWs1Jm00zvaqaKx9kfEt2wO/ZSubdV8l0UFx83cwo0Qe8wZsddqeqRNd1d0m8dQvRvt3FMUZjhdB9ZJZDbb9LGsvtD7y1bdrm0Te1kvAV9deSAwjZP2krWGSwt6ViCRngU2Jm0EgEa7rgfWq420Sp6h0MOZUkKToT29c9WVg7t5pXz9skMArQOIsCyWxgH+sILgqTBKIOrM/WNhOuwnoqhSH9ZToXtx2mnEFcM6yUDvrq5afKzovNDqrG4st4rBfo5cefPcAfePYj/SYCIxXgMqzs1AfafTw7MrUsARtq6kew9j3qcxFiJ9JmR8tW4XxXknwVWiPtPWlK6BjcKs5NsFYLZCYxPQVzsbYwSo4aHQc08OuSM72I52qjgT+9tOyGlcqiW15v3Vw4JKoj1TwaXb4WljlL2VV+G4gcHMwn5m+K6YPAiNxVb56LgfZ9LBtxtmKanf82G9qjm6swl3a83nGqJNx5s7IvTTKpY8zrsQSthKO2gio5r3QvOcjxsT8FPSg75je3DPjq5J9hE49xsMca5GXcSmJ7ReEle2liARdFFJp0K3Q62VDku2B9VX7V09XnCOR6LR+KC2LqvTbn01r77zmLyUxXjeoyp2wV51WDsW5uWrVchocxDYtUWP03TP63xs7wWh3kruWRov0g6+FPwUpdvJM+KLw6cP896KfCHv/+nFgKROq4SPhNeGdsnReADtceZ4XPiL8TXhT+IXwhjDzLyliW2HNwJqBNQNrBtYMrBm4/zLwF+xfAZbsk4bMAAAAAElFTkSuQmCC')

group.appendChild(circle);
group.appendChild(rect);
group.appendChild(image);

svg.appendChild(group);

// 文字列として出力
console.log(svg.outerHTML);

<svg xmlns:xlink="
://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1"><g><circle fill="yellow" stroke-width="2" r="30" cy="50" cx="50"></circle><rect fill="pink" stroke-width="2" stroke="red" height="30" width="30" y="50" x="10"></rect><image xlink:href="data:image/png;base64,iVBORw0KG…省略" height="39" width="81" y="0" x="0"></image></g></svg>