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