更好的SVG旋转文本呈现

我想知道是否有一种方法可以更好地呈现SVG旋转文本？更好的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/ 好像字符没有关注基线，我不明白为什么。

非常感谢您的帮助。

来源

2013-03-13 justinbridou

我有类似的问题。当文字旋转时所有的字母都在抽搐。它发生在所有浏览器中。幸运的是，我没有太多的旋转文本，我只是将text转换为path。之后，它完美的作品。但是，如果你不得不旋转大量的文字 - svg的大小会大幅增加。

来源

2013-03-13 13:08:01 XiM

aww ...你知道任何可以完成这项工作的工具吗？我认为使用svg字体可以帮助（路径？），但它不会。我的SVG图形是用javascript的位生成的。我没有太多的旋转文字，但因为它是动态内容，我不能手动进行。感谢您的回复btw。 – justinbridou 2013-03-13 13:56:29

我的内容是静态的，使用Inkscape很容易......在你的情况下，我可以建议通过“gliph”定义字母并尝试使用它们。为你一些有用的链接： http://stackoverflow.com/questions/2149707/get-font-glyphs-as-vectors-manipulate-and-product-svg-or-bitmap 也许： HTTP：/ /stackoverflow.com/questions/7742148/how-to-convert-text-to-svg-paths – XiM 2013-03-13 14:17:23

这与SVG字体相比要好得多，请查看http://jsfiddle.net/vbzTd/3/ 将此应用于我的项目，这是完美的！非常感谢您的帮助！ – justinbridou 2013-03-13 14:28:16

更好的SVG旋转文本呈现

回答

相关问题