Javascript Canvas translate函数在键触发器上不起作用

当我放置

engine.map.ctx.translate（engine.moveX，engine.moveY）时就像那样，它工作得非常完美，但当我尝试在键触发器上调用此函数时，它什么也没有给我

我正在用alert检查键触发器是否有效，但是
engine.map.ctx.translate（engine.moveX，engine.moveY）在switch语句中不起作用

var engine = {}
    engine.moveX = 0;
    engine.moveY = 0;

engine.map = {}
    engine.map.canvas = document.getElementById('canvas');
    engine.map.ctx = engine.map.canvas.getContext('2d');

document.onkeydown = function(evt) {
    evt = evt || window.event;
    switch(evt.keyCode){
    case 37:
         engine.moveX -= 15;
         engine.map.ctx.translate(engine.moveX, engine.moveY);
         alert('left');
         break;
    case 38:
         engine.moveY -= 15;
         engine.map.ctx.translate(engine.moveX, engine.moveY);
         alert('up');
         break;
    case 39:
         engine.moveX += 15;
         engine.map.ctx.translate(engine.moveX, engine.moveY);
         alert('right');
         break;
    case 40:
         engine.moveY += 15;
         engine.map.ctx.translate(engine.moveX, engine.moveY);
         alert('down');
         break;
    }
};

ctx.translate
命令不是用来重新绘制任何内容的

它仅为后续绘制重新定位画布

因此，您现在还需要重新绘制对象。
它应该给出什么，为什么不起作用，我看不出任何错误这就是问题所在，我看不出它应该在箭头上按将画布上下文15px移动到单击箭头的方向，但为什么
ctx.translate（-75，-30）将在switch语句外部工作，但当内部不产生任何结果时？使用html画布绘制的形状不“可移动”。若要“移动”形状，必须将其删除并在其新位置重新绘制。html canvas context.translate命令将画布原点移动到指定的x，y，但不会“移动”任何现有图形。它仅影响在context.translate之后完成的任何图形。我没有你的代码的副本，但我怀疑在switch语句外，你在翻译+绘图，而在switch语句内，你在翻译-但不-绘图。因此，假设我有15个图块上15个图块的地图视图（每个15px）但ofc整个地图要大得多，我想按向左箭头键将地图向左移动1个平铺或15px，我需要再次循环语句？如果是这样的话，如果我将地图视图放大，使用更多类型的平铺图像，我的代码不会变得太慢吗？Canvas非常快，可以处理平移（显示以前屏幕外的平铺）。当平移时，你自己的应用程序是慢还是快完全符合你的应用程序的设计要求，以及你在编码时的性能意识。非常感谢你，仍然。。。这就是我做的全部事情，那么为什么switch语句中的ctx.translate（）函数单独调用会产生不同的效果呢？