SVGのviewportとviewBox

[programming]

SVGをHTMLに貼り付けて、それを拡大/縮小しようとしたら、おもった以上にはまったのでメモ。

  • viewportは描画領域
  • viewBoxはviewport内に表示するSVG内の領域(SVGの一部を切り取って表示もできる)

viewBoxをSVG全体とフィットさせるようにしておいて、viewportのサイズを変えることにより、拡大/縮小が出来る。


参考