javascript:svg2png : カンバスたれ、計算機

javascript:svg2png

svg要素をxmlシリアライズしてimgに書き込んでcanvasに描き込んでpngにするだけ。

途中の w=i.width,h=i.height を変えれば倍率が上がっていい感じに高解像度になるのはさすがベクタ画像といったところ。

ただ、このブックマークレットを適用できる対象がこのサイトにはあまりないのが残念（<object> で書いていたりするので）

1
2


(()=>document.querySelectorAll('svg').forEach(s=>{let i=document.createElement('img');i.onload=()=>{let c=document.createElement('canvas'),w=i.width,h=i.height;c.width=w,c.height=h;let ctx=c.getContext('2d');ctx.drawImage(i,0,0,w,h);i.onload=null;i.src=c.toDataURL();document.body.appendChild(i);};i.src='data:image/svg+xml;charset=utf-8;base64,'+btoa(new XMLSerializer().serializeToString(s));}))();