html - 沿 SVG 路径渲染 RTL 文本

标签 html svg right-to-left hebrew

尝试沿 SVG 中的路径呈现希伯来语文本会导致 Chrome 中出现错误 - 字形向后呈现(从左到右),使文本不可读。

letters are backwards

<svg height="220" width="190">
    <defs>
        <path id="MyPath2" d="M0,100 L200,100" />
    </defs>
    <use xlink:href="#MyPath2" fill="none" stroke="red"  />
    <text text-anchor="middle" dx="100" dy="0" writing-mode="rl" direction="rtl">
        <textPath xlink:href="#MyPath2">
            הטקסט הזה ייראה הפוך
        </textPath>
    </text>     
</svg>

有没有办法解决这个问题?这是已知错误还是有我应该使用的属性?

JSFIddle: http://jsfiddle.net/j9RnL/

最佳答案

我自己没有找到优雅的解决方案,只是将字符反转。

function reverse(s, languageCode) {
    if (['he', 'ar'].indexOf(languageCode) === -1)
        return s;
    return s.split("").reverse().join("");
}

关于html - 沿 SVG 路径渲染 RTL 文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24849981/

相关文章:

javascript - 光标通过 CSS :hover. 更改,无需移动鼠标即可从 DOM 中删除元素。更新鼠标光标?

html - 没有样式表的 Z-Index

css svg 和矢量效果 ="non-scaling-stroke"浏览器兼容性

javascript - 如何将事件监听器添加到 svg 中的对象?

javascript - Internet Explorer 11 忽略列表样式 :none on the first load

html - 水平居中绝对元素

image - 将 SVG 文件转换为多个不同大小的 PNG 文件

tomcat - Itext 5.5 将 RTL 语言(阿拉伯语)的 HTML 转换为 PDF 不适用于 tomcat

android - 方向改变后,针对 "layout-ldltr"加载 "layout-ldrtl"布局中的 android 错误吗?

HTML5 页面语言、方向和编码