我的 Canvas 中间有一个 Angular 色，他会旋转以始终面向我的鼠标位置 - 无论鼠标在 Canvas 上的哪个位置。
我现在要做的是，当我按下 W 或向上箭头时，我的 Angular 色将走向鼠标。我不确定这背后的数学原理，所以我需要一些帮助。
现在，我有一个监听 WASD/箭头键的函数:
Player.prototype.playerAnimation = function (){
//UP
if(this.isUpKey){
//Character movement [drawX/Y is the position of character]
this.drawY = mouseY;
}
当然，这只会将 Angular 色 move 到鼠标的 Y 位置 - 根本不是我要找的位置。就是不知道需要什么样的公式？
谢谢
最佳答案
如果你已经成功地向鼠标方向旋转，你必须计算 Angular 色和光标之间的 Angular ，所以现在不是绝对 move (=mouseY) 你应该增加this.drawY 和 this.drawX 的某个值将有效地成为 Angular 色的速度。
但是，您希望 X 和 Y move 的对 Angular 线为该值，因此像这样的东西会将其分解为分量 X 和 Y:
this.drawX=this.drawX+this.speed*Math.cos(d2r(angle));
this.drawY=this.drawY+this.speed*Math.sin(d2r(angle));
如果您使用的是度数而不是弧度:
function d2r(d){
var r=d*(Math.PI/180);
return r;
}
根据 Angular 确定方式，您可能需要使用公式中的符号。哦，如果您希望它在按住键时继续 move ，您需要添加一些 setTimeout 以在一段时间后重新触发 playerAnimation 函数
关于javascript - HTML5 + JavaScript - 将字符移向鼠标位置？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14467426/