SVG要素（データ）をbase64でエンコードしてData URLスキームに変換する関数

Tweet

Pocket

//---------------------------------
//svgのDOM要素をbase64コードに変換
//
//引数1:$svg    svg要素
//
//返り値:data URL スキーム
//---------------------------------
function getDataURLFromSVG($svg){
    let svgData = new XMLSerializer().serializeToString($svg[0]);
    return "data:image/svg+xml;base64,"
                + btoa(unescape(encodeURIComponent(svgData)))
}

上記の返り値をimgタグのsrc属性に設定すればsvg画像が表示されます。

Tweet

Pocket

Related posts:

jQueryでテキストを改行で分割して、行毎に先頭と末尾のスペースを削除する関数 style属性からプロパティ値取得するjavascriptの関数 style属性にプロパティ値設定するjQuery関数 YouTube Player APIで動画の開始位置（秒）と終了位置（秒）を設定し再生する方法 CKEditorにWEBフォントを設定する方法 HTML要素をSVG要素に変換するjQuery関数 イラストレーターでタイトルロゴを作成！SVG文字ジェネレーターを作る方法 Datepickerライブラリ「Flatpickr」を使って日めくり不要カレンダーを作りました JavaScriptとjQueryの書き方を比較してみた