|
1 <!DOCTYPE HTML> |
|
2 <html> |
|
3 <head> |
|
4 <title>Test to ensure left/right and start/end are offset by text width for rtl text</title> |
|
5 </head> |
|
6 <body> |
|
7 <canvas id="c" width="128" height="64" style="direction:rtl"></canvas> |
|
8 <script type="text/javascript"> |
|
9 var canvas = document.getElementById('c'); |
|
10 var ctx = canvas.getContext('2d'); |
|
11 |
|
12 |
|
13 ctx.fillStyle = 'black'; |
|
14 ctx.font = '20px sans-serif'; |
|
15 ctx.textBaseline = 'top'; |
|
16 |
|
17 var str = 'TEXT'; |
|
18 var wid = ctx.measureText(str).width; |
|
19 |
|
20 ctx.textAlign = 'left'; |
|
21 ctx.fillText(str, 64, 0); |
|
22 ctx.textAlign = 'start'; |
|
23 ctx.fillText(str, 64, 20); |
|
24 ctx.textAlign = 'center'; |
|
25 ctx.fillText(str, 64, 40); |
|
26 |
|
27 </script> |
|
28 </body> |
|
29 </html> |