我只想水平或垂直翻转 SVG 文本元素,但添加 transform="scale(-1, 1)"
属性会导致空白结果。
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="200"
height="200">
<text x="100"
y="100"
transform="scale(-1, 1)">SVG test text</text>
</svg>
</body>
</html>
最佳答案
它脱离了 SVG Canvas 。 100 的 x 变为 -100,因为它也进行了缩放。我刚刚取消了 x 值以使其再次可见。
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="200"
height="200">
<text x="-100"
y="100"
transform="scale(-1, 1)">SVG test text</text>
</svg>
</body>
</html>
关于SVG 文本翻转/镜像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61065385/