SVGのviewBoxをみてwidthとheightをつけるやつ

SVGのviewBoxをみてwidthとheightをつけるやつ

<svg> にwidth, height属性が付いていないために横幅が親要素の100%になってしまう
viewBox "0 0 36 36" と指定されている
この情報を用いて正方形で表示したいところ
クリックしてmodalで表示すると極小サイズで描画される

<svg> にwidth, heightが付与された蟹
等身大 (viewBoxで指定されたサイズ) の蟹

アスペクト比を保ちつつ横幅を200pxにした蟹


他の例

仕様
?svg=srcUrl
<svg> に書かれたviewBox属性の値をそのまま使う
/
片辺のピクセル数を与えてアスペクト比を保って拡縮する
/w/100
/h/100

GitHub

Vercel app

Powered by Helpfeel