为什么SVG tspan属性会改变文本的水平对齐方式？

Question

HTML：

<svg>
    <g transform="translate(100, 100)">
        <circle r="3"></circle>
        <text text-anchor="middle">
            Test<tspan y="2">xxxxxxxxxxxxxx</tspan>
        </text>
    </g>
</svg>

x与Test重叠。我不明白为什么会这样。如果我删除text-anchor属性，则不会发生。

演示：http://jsfiddle.net/dvt4nv94/2/

Answer 1

指定x或y属性使得tspan绝对定位，因此它就好像它本身存在而不是作为define dbid_1=:dbid; 容器的一部分。

设置dy =＆＃34; 2＆＃34;而不是y =＆＃34; 2＆＃34;将达到你想要的效果。