显示带有双向覆盖和文本锚点的 SVG RTL 文本的浏览器差异 = "end"



我注意到浏览器在显示强制从右向左的文本和使用text-anchor="end"时的区别。

<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" > 
    <text x="10" y="50" font-size="30" font-family="sans-serif" writing-mode="rl" direction="rtl" unicode-bidi="bidi-override" text-anchor="end" stroke="green" fill="green">
        Force RTL
    </text>
</svg>

在Chrome(v 27.0.1453.93 m)和I.E.(v 9.0.8112.16421)中,文本显示为我所期望的,字形笔划从文本的终点开始,并向左侧前进。在上面的例子中,它显示在浏览器的左上角。

在Firefox (v 20.0.1)中,使用text-anchor="end"的字形描边从文本的起始点开始,显示在页面之外。如果我删除文本锚属性,Firefox显示为Chrome, I.E.使用作为文本锚。

我的问题是

    有人明白这里发生了什么吗?或者这是FF的bug?
  1. 如果没有解决方法,我如何在SVG中的用户代理之间切换,以便Firefox可以避免使用文本锚?

Thanks very much

这是Firefox的一个bug。幸运的是,它很快就会修复(不确定具体是什么时候),因为我们正在修改/重写SVG中的文本支持。如果您想看到它正常工作,请在URL栏中下载一个Firefox夜间版本,键入about:config并设置svg.text.css-frames。使能到true。所以要小心用户代理测试,因为这个问题很快就会解决。

最新更新