按左或右键时如何转动汽车

Question

我是画布的新手并开发一款汽车直行的游戏，现在我想按下左键时逆时针转动汽车，按下右键时顺时针转动汽车。

目前我正在尝试

var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");



var heroReady = false;
var heroImage = new Image();
heroImage.onload = function () {
    heroReady = true;
};
heroImage.src = "images/car.png";
  if (37 in keysDown) { // Player holding left
  drawSprite(heroImage, hero.x, hero.y, scale = 1,angle = 90);    
}

但这根本不起作用。我只想转动车而不是屏幕。任何帮助都表示赞赏。 我的源代码：working pen

Answer 1

请参阅此问题的答案：https://gamedev.stackexchange.com/questions/67274/is-it-possible-to-rotate-an-image-on-an-html5-canvas-without-rotating-the-whole。

基本上：

1. 首先保存画布坐标系（ctx.save（））。
2. 旋转画布。
3. 在旋转的画布上绘制图像。
4. 然后恢复画布坐标（ctx.restore（））。