我试图在 HTML5 Canvas 的 2d 上下文上使用 fillText() 方法来绘制用阿拉伯语编写的字符串。它工作得很好，直到我在字符串末尾添加了标点符号。然后标点符号出现在字符串的错误一侧（在开头，而不是结尾，就好像它是 ltr 而不是 rtl 字符串）。我使用了 Context.textAlign 属性，但这似乎只涉及字符串相对于指定位置的绘制方式，而不涉及文本的实际方向。有谁知道这个问题的解决方案？
Thanks.
Update:我找到的答案是向页面上的canvas元素添加一个“dir”属性。例如，
<canvas dir="rtl">
但是，我仍然不知道如何更改发送到 fillText 的各个字符串的 dir 属性。有任何想法吗？
您不需要为每个单独的字符串设置方向。请参阅以下示例，该示例还显示了如何正确使用隐式双向控制标记以实现正确的显示顺序：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<canvas id="myCanvas" width="700" dir="rtl" height="250" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script type="text/javascript" charset="utf-8">
var c = document.getElementById("myCanvas");
var cArabic = c.getContext("2d");
cArabic.font="25px Arial";
// Simple Sentence with punctuation.
var str1 = "این یک آزمایش است.";
// Few sentences with punctuation and numerals.
var str2 = "۱ آزمایش. 2 آزمایش، سه آزمایش & Foo آزمایش!";
// Needs implicit bidi marks to display correctly.
var str3 = "آزمایش برای Foo Ltd. و Bar Inc. باشد که آزموده شود.";
// Implicit bidi marks added; "Foo Ltd.‎ و Bar Inc.‎"
var str4 = "آزمایش برای Foo Ltd. و Bar Inc. باشد که آزموده شود.";
cArabic.fillText(str1, 600, 60);
cArabic.fillText(str2, 600, 100);
cArabic.fillText(str3, 600, 140);
cArabic.fillText(str4, 600, 180);
</script>
</body>
</html>
And here is the output:
