svg矩形绕着y轴旋转

Question

rect构成的矩形怎么绕着Y轴旋转？效果如下图：

Answer 1

可以先设置使其 transform-origin 在中心点，再scale(-1,1)，差不多是这个样子：

transform="50%, 50%"
transform="scale(-1,1) translate(0%, 0%)"

对于div盒子应该是可行的，SVG的话可能需要改改translate的参数。
数学好的话也可以试试放射变换，矩阵大致是：

[
    -1,  0,  Xmax,
     0,  1,  0,
     0,  0,  1
]

不过使用这个矩阵需要提前知晓宽度 Xmax，可以求解下其他矩阵。