SVG中的Chrome v49字母间距,带有变换矩阵

时间:2016-03-21 13:33:12

标签: google-chrome svg letter-spacing

当与矩阵转换和翻译结合使用时,Chrome v49在SVG中损坏了letter-spacings

enter image description here

活生生的例子:https://jsfiddle.net/75fpn6de/6/

SVG:

<svg height="300px" version="1.1" width="100%" xmlns="http://www.w3.org/2000/svg">
    <g transform="matrix(0.20695652173913043,0,0,0.20695652173913043,0,10.881739130434767)">
        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" viewBox="0 0 2500 2794" width="2500" height="2794">
            <g transform="translate(1436.5 1087) rotate(0)">
                <text xmlns="http://www.w3.org/2000/svg" fill="#ed7373" y="237" style="font-family: 'Great Vibes';" font-size="237" letter-spacing="0.1em" text-anchor="middle">Some text</text>
            </g>
        </svg>
    </g>
</svg>

CSS:

@import url(https://fonts.googleapis.com/css?family=Great+Vibes);

我在这里做错了什么(比如打破了一些规格),Chrome变得更加“限制性”,还是Chrome中新推出的错误?

FYI:这个例子(显然)只是服务器动态生成的更大SVG的一小部分,我不能只改变嵌套以及变换矩阵和放大器的使用;翻译功能。

1 个答案:

答案 0 :(得分:1)

我遇到了同样的问题,即使我在更改日志中找不到关于此问题的任何内容,它似乎已在Chrome 50中得到修复。