Html5画布：旋转的文字在Google Chrome浏览器上看起来失真

我在HTML5画布中旋转了文字。除了谷歌浏览器之外，它在所有浏览器上看起来都很好。它在Windows上看起来很乱。另外，它在MAC上看起来很好。为什么这样？我正在使用Chrome beta 20.它是HTML 5问题还是一些Google Chrome或Windows错误？我如何解决这个失真问题？Html5画布：旋转的文字在Google Chrome浏览器上看起来失真

<!DOCTYPE HTML> 
<html> 
    <head> 
    <style> 
     body { 
     margin: 0px; 
     padding: 0px; 
     } 
     #myCanvas { 
     border: 1px solid #9C9898; 
     } 
    </style> 
    <script> 
     window.onload = function() { 
     var canvas = document.getElementById("myCanvas"); 
     var context = canvas.getContext("2d"); 

     context.font = "12pt Calibri"; 
     context.rotate(Math.PI/2.5); 
     context.fillText("Competitive Landcaping!", 450, 100); 
     }; 

    </script> 
    </head> 
    <body> 
    <canvas id="myCanvas" width="878" height="2000"></canvas> 
    </body> 
</html>

来源

2012-07-20 user1502901