SVGをData URIに変換
SVGをData URIに変換するには、btoaメソッドを使用します。
btoaメソッドは文字列をbase64へ変換します。
それに加えて先頭にdata:image/svg+xml;base64,を付けることで、Data URIとして扱うことができます。
サンプルコード
JavaScript (ES5)
var dataUri = 'data:image/svg+xml;base64,' + btoa('<svg> .... </svg>'),
imgElem = document.createElement('img');
imgElem.src = dataUri;
imgElem.alt = '';
document.body.appendChild(imgElem);JavaScript (ES6以降)
const dataUri = 'data:image/svg+xml;base64,' + btoa('<svg> .... </svg>'),
imgElem = document.createElement('img');
imgElem.src = dataUri;
imgElem.alt = '';
document.body.appendChild(imgElem);