shiroyuki2020 https://blog.hatena.ne.jp/shiroyuki2020/ プログラミングとウェブデザインの勉強メモ https://shiroyuki2020.hatenablog.com/ SVG 要素が持つtransform属性に対して、変換を指定します。変換には「移動」「拡大・縮小」「回転」「剪断」があります。それぞれ、指定の仕方を見ていきます。 translation:移動 scale:拡大・縮小 rotate:回転 skew:剪断(せんだん) 変換の順序 まとめ translation:移動 <symbol id="cross" stroke-width="3"> <line x1="10" y1="20" x2="30" y2="20"/> <line x1="20" y1="10" x2="20" y2="30"/> </symbol> <use href="#cross" … 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fshiroyuki2020.hatenablog.com%2Fentry%2Fintroduction_to_svg_05" title="SVG|座標系の変換:transform - プログラミングとウェブデザインの勉強メモ" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> Hatena Blog https://hatena.blog 2021-08-23 19:00:00 rich https://shiroyuki2020.hatenablog.com/entry/introduction_to_svg_05 1.0 100%