如何将非英语文本分解为javascript中的组成字符？

Question

我正在尝试沿着html5画布上的曲线绘制文本。要做到这一点，我需要将输入文本分解成可以单独旋转和翻译的组成字符。文本的分解对于英语来说很容易。给定输入字符串s，s[i]给出第i个字符。但这不适用于非英语字符串。我在这里有一个jsfiddle来说明问题：http://jsfiddle.net/c6HV8/。请注意，在撰写本文时，Chrome和IE中的小提琴显示不同。要查看问题所在，请考虑字符串s中包含非英语文本。创建您传递s的文本节点。接下来，为每个s[i]创建一个文本节点，并显示彼此相邻的文本节点。现在比较结果。他们不一样。如何将非英语文本分解为javascript中的组成字符，以便两个结果相同？

Answer 1

भाईसाब:)所以我相信你已经知道，问题是fillText和createText都可以处理整个字符串，所以它能够评估字符串以及所有字符串变音符号（组合字符）。但是，当您为每个字符调用fillText和createText时，没有任何变音符号与它们应该附加的字符一起出现。因此，它们会被单独评估和绘制，这就是为什么你会看到变音符号和虚线圆圈（一种占位符的形式：在这里放置一个字符）。

真的，没有简单的方法可以做到这一点。你的算法基本上必须是这样的：

• 从字符串中查找当前字符。
• 查找所有连续字符变音符，然后将所有字符组合成一个新字符串。
• 使用fillText渲染该字符串。

您可以在a forked version of your fiddle查看结果。我修改了示例文本以添加一些更复杂的字符，以确保算法正常工作。代码肯定可以清理;我只是把它作为一个概念验证。

如果您想要将所有语言的变音符号列出一系列代码点，那么很难实现。 This answer提供了一个可帮助您入门的列表。