text-font-lang.html (1326B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Test for language-sensitive font prefs on canvas</title> 5 <script type="text/javascript"> 6 function test(canvasID) { 7 var canvas = document.getElementById(canvasID); 8 var ctx = canvas.getContext('2d'); 9 10 var str = 'Hello world! \u4F60\u597D\u5417\uFF1F'; 11 ctx.font = '2em sans-serif'; 12 ctx.fillStyle = 'black'; 13 ctx.textAlign = 'left'; 14 ctx.textBaseline = 'top'; 15 ctx.fillText(str, 10, 10); 16 }; 17 </script> 18 </head> 19 <body> 20 21 <!-- 22 In the reference, all divs are tagged with lang="en". 23 The expectation is that at least some of them will resolve 24 "sans-serif" to different fonts according to language. 25 --> 26 27 <div lang="ar" style="margin:20px; height:100px;"> 28 <canvas id="c1" width="400" height="50"></canvas> 29 <script type="text/javascript"> 30 test("c1"); 31 </script> 32 </div> 33 34 <div lang="ja" style="margin:20px; height:100px;"> 35 <canvas id="c2" width="400" height="50"></canvas> 36 <script type="text/javascript"> 37 test("c2"); 38 </script> 39 </div> 40 41 <div lang="zh-TW" style="margin:20px; height:100px;"> 42 <canvas id="c3" width="400" height="50"></canvas> 43 <script type="text/javascript"> 44 test("c3"); 45 </script> 46 </div> 47 48 <div lang="en" style="margin:20px; height:100px;"> 49 <canvas id="c4" width="400" height="50"></canvas> 50 <script type="text/javascript"> 51 test("c4"); 52 </script> 53 </div> 54 55 </body> 56 </html>