javascript - 在按键上更改形状的坐标

Question

我有一个<canvas/>, 和一个形状渲染。我正在尝试在按键上更改形状的坐标，但没有运气。

这是我的来源：

var canvas = document.getElementById('game');
var context = canvas.getContext('2d');
var radius = 35;

var xPos = 0;

context.beginPath();
context.arc(xPos, 0, radius, 0, 2 * Math.PI, false);
context.fillStyle = 'green';
context.fill();
context.lineWidth = 5;
context.strokeStyle = '#003300';
context.stroke(); 

$(document).keypress(function(event) {
    if (event.which == 100) {
        xPos++;
    }
});

我遇到的另一个问题是弄清楚什么键是什么数字？某处有图表吗？我在不同的网站上看到了两个相互冲突的价值观。

Answer 1

以下文章http://atomicrobotdesign.com/blog/htmlcss/move-objects-around-the-canvas-using-the-keyboard-and-jquery/详细介绍了使用 jQuery 引用 Canvas 对象然后对其进行操作目的。

它还检查了如何调整 Canvas 对象的位置以响应用户输入的击键。

希望有帮助。