更好的SVG旋转文本呈现

Better SVG rotated text rendering

本文关键字：文本 旋转 SVG 更好      更新时间：2023-09-26

我想知道是否有一种方法可以更好地渲染svg旋转文本?

<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" width="900" height="400"  xmlns="http://www.w3.org/2000/svg">
     <text x="50" y="50" id="text_0" transform="rotate(17, 50, 50)">
         SVG text test 
    </text>
</svg>

您可以在这里测试这段代码的呈现:http://jsfiddle.net/vbzTd/2/似乎字符没有遵循基线，我不明白为什么。

非常感谢你的帮助

我也遇到过类似的问题。当文本被旋转时，所有的字母都在抽搐。这在所有浏览器中都会发生。幸运的是，我没有那么多的文本旋转，我只是将text转换为path。在那之后，它就完美地工作了。但是如果你必须旋转大量的文本，svg的大小将急剧增加。

相关文章：