ブラウザで表示したSVGを画像として扱いたい - Qiita

お昼ごはんを食べながら「ブラウザで表示したSVGを画像にしてダウンロードしたい」というのは需要がありそうだなと思ったので調べました。 やはりstackoverflowにありました。ありがたいですね。 これをコピペして少しいじって試しました（Chromeで確認） Demo: https://jsfiddle.net/r208on37/1/ 画像をBlob URLで扱うついでに、1アクション挟んで「別タブ表示」「imgタグ」「ダウンロードリンクの生成」もできるか試しました。 仕組み 仕組みは大したことはやっていなくて、Blob URLとcanvas便利ですね、という感じです。 DOM上のSVGをXMLSerializerでSVGタグのテキストとして取り出す SVGタグのテキストからBlob URLを生成 Blob URLをimgタグに読み込ませる（モダンブラウザはSVGをimgタグで扱える）