SVGのviewBoxでは凝りたくない

引き続きSVGについてのメモ。
svgタグのviewBox属性では、(0,0)から、svgの幅・高さをとる、ということ以外したくない。以下のごとくにしたい。

<svg width="500px" height="500px" viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">

だって、svgとviewBoxの矩形のアスペクト比が違っていると、余白が入ったり歪んだりするし。それらを操作するためにpreserveAspectRatio属性を指定しないといけないし。次の記事にある。

qiita.com qiita.com

あと、例えば「見た目でわかる最小の大きさのドット」を打つつもりでcircleを使いたくても、svgとviewBoxの矩形のサイズが違うと意図どおりに表示できないので。

そんなわけで～～
svgタグのviewBox属性では、(0,0)から、svgの幅・高さをとる、ということ以外したくない。