Chrome 中的 SVG，<tspan> x 和 y 值被忽略答案

【问题标题】：SVG in Chrome, <tspan> x and y values are ignoredChrome 中的 SVG，<tspan> x 和 y 值被忽略
【发布时间】：2013-12-18 11:54:50
【问题描述】：

在 Firefox 和 IE 中，以下 SVG 代码有效，它在 <tspan> x 属性中列出的 x 坐标处绘制单词EXAMPLE 的每个字符，并在y 坐标处绘制所有字符。

<text style="font-size: 183px ; fill:rgb( 0 , 0 , 0 ); font-family: Trebuchet MS"> 
    <tspan x="1575 1716 1857 1998 2139 2280 2421" y="212">EXAMPLE</tspan>     
</text>

根据w3.org，这在 SVG 1.1 和 1.0 中都很好。

但是，在 Chrome 中，这些值会被忽略，它们会一直绘制在视图框的左上角。如果我将 x 和 y 值复制到 <text> 标记中，那么它可以在 Chrome 中运行（FF 和 IE 也一样）。

<text style="font-size: 183px ; fill:rgb( 0 , 0 , 0 ); font-family: Trebuchet MS"
 x="1575 1716 1857 1998 2139 2280 2421" y="212"> 
    <tspan>EXAMPLE</tspan>     
</text>

由于我正在使用的文件是从程序自动生成的，因此对我来说进行更改并不那么容易。

为什么 Chrome 会忽略这些元素？对程序进行更改是我唯一的选择吗？

【问题讨论】：

您是否在crbug.com 报告了此错误？

标签： html google-chrome browser svg

【解决方案1】：

尝试改用dx 和dy，您可以在此处找到有关如何使用它们的信息：http://tutorials.jenkov.com/svg/tspan-element.html

【讨论】：