画布从底部中心图像角度旋转？

Question

画布从底部中心图像角度旋转？

Tom*_*Tom 14 javascript html5 canvas rotation

如何使用画布html5元素从底部中心角度旋转图像？

<html>
    <head>
        <title>test</title>
        <script type="text/javascript">
            function startup() {
                var canvas = document.getElementById('canvas');
                var ctx = canvas.getContext('2d');
                var img = new Image();
                img.src = 'player.gif';
                img.onload = function() {
                    ctx.translate(185, 185);
                    ctx.rotate(90 * Math.PI / 180);
                    ctx.drawImage(img, 0, 0, 64, 120);
                }
            }
        </script>
    </head>
    <body onload='startup();'>
        <canvas id="canvas" style="position: absolute; left: 300px; top: 300px;" width="800" height="800"></canvas>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

不幸的是,这似乎是从图像的左上角旋转它.任何的想法？

编辑:最后,对象(太空飞船)必须像时钟指针一样旋转,就像它向右/向左转.