javascript - svg中是否有变换矩阵，所以x变为y且y变为x？

我正在与svgpath一起操作svg，并且，我需要更改协调系统，以使y变为x并且x变为y。我的问题是有什么办法可以做到。我尝试绕点0 0旋转并按其高度平移图形。

最佳答案

作为svg转换属性，它是

transform="matrix(0 1 1 0 0 0)"

<svg width="300" height="100"  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <symbol id="pos" >
    <path fill="none" stroke="black" d="M20,80 V20 H80 M20,20 80,80" />
    <circle cx="20" cy="20" r="10" fill="red" />
    <circle cx="80" cy="20" r="10" fill="yellow" />
    <circle cx="20" cy="80" r="10" fill="green" />
    <circle cx="80" cy="80" r="10" fill="blue" />
  </symbol>
  <!-- transposed -->
  <use xlink:href="#pos" transform="matrix(0 1 1 0 0 0)" />
  <!-- original, but moved to the side for comparison -->
  <use xlink:href="#pos" transform="translate(150)" />
</svg>

用svgpath语法，

svgpath(__your_path__).matrix([0, 1, 1, 0, 0, 0])

关于javascript - svg中是否有变换矩阵，所以x变为y且y变为x？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/48975421/