我有一些用阿拉伯语写的文本，在将其包装在wheelnav.js导航项中时遇到一点问题，这是一个jsFiddle：
WheelNav.js Arabic Text Wrapping Problem jsFiddle
我一直在考虑注入可以希望解决该问题的SVG异物，我有一个方法，但不完全是在wheelnav.js的哪一部分中做的，这是来自mozilla dev的示例代码：
<svg width="400px" height="300px" viewBox="0 0 400 300"
xmlns="http://www.w3.org/2000/svg">
<desc>This example uses the 'switch' element to provide a
fallback graphical representation of a paragraph, if
XHTML is not supported.</desc>
<switch>
<foreignObject width="100" height="50"
requiredExtensions="http://www.w3.org/1999/xhtml">
<!-- XHTML content goes here -->
<body xmlns="http://www.w3.org/1999/xhtml">
<p>Here is a paragraph that requires word wrap</p>
</body>
</foreignObject>
<text font-size="10" font-family="Verdana">
<tspan x="10" y="10">Here is a paragraph that</tspan>
<tspan x="10" y="20">requires word wrap.</tspan>
</text>
</switch>
</svg>
感谢您能获得的任何帮助，甚至可以选择其他解决方案。
最佳答案
您可以在这里修改wheelnav.js：
//Title defined by path
if (wheelnavTitle().isPathTitle(this.title)) {
this.navTitle = this.wheelnav.raphael.path(currentTitle.path);
}
//Title defined by image
else if (wheelnavTitle().isImageTitle(this.title)) {
this.navTitle = this.wheelnav.raphael.image(currentTitle.src, sliceInitPath.titlePosX - (this.titleWidth / 2), sliceInitPath.titlePosY - (this.titleHeight / 2), this.titleWidth, this.titleHeight);
}
//Title defined by text
else {
this.navTitle = this.wheelnav.raphael.text(sliceInitPath.titlePosX, sliceInitPath.titlePosY, currentTitle.title);
}
您必须为外部对象添加另一个else分支。
您可以找到源here。
我发现了GitHubGist这将是有用的。