Javascript 如何将度值更改为实际的x/y位置变化？

我在html画布上画了一个圆圈，这个圆圈表示一艘“船”

我有“Ship”对象的当前位置（x，y），并随机确定度（0到360）和数量值。 然后我想改变船的当前位置的程度和数量

i、 E.船舶目前处于100/100（在画布上）。 我确定学位为30，金额为50

现在我想得到新的位置，假设0度表示“直线上升”，180度表示直线下降，而50度表示50个像素向确定的方向移动

我知道这和弧度有关，但不幸的是我无法进一步解决它

var ship = {
  x: 100,
  y: 100
}

var movement = {
  degrees: 30,
  amount: 50
}

---

你说得对。您必须将度转换为弧度（

1度=PI/180

），然后计算适当的正弦和余弦

var angle = degrees * Math.PI / 180;
var dx = Math.cos(angle) * amount;
var dy = Math.sin(angle) * amount;
x += dx;
y += dy;

---

你说得对。您必须将度转换为弧度（

1度=PI/180

），然后计算适当的正弦和余弦

var angle = degrees * Math.PI / 180;
var dx = Math.cos(angle) * amount;
var dy = Math.sin(angle) * amount;
x += dx;
y += dy;

---

是的，JavaScript中的所有角度都以弧度为单位。此外，画布上下文右侧有0°点，因此如果希望0°笔直向上，则需要从所有角度减去90°：

var angle = (movement.degrees - 90) / 180 * Math.PI;  // compensate angle -90°, conv. to rad
ship.x += movement.amount * Math.cos(angle);          // move ship
ship.y += movement.amount * Math.sin(angle);

var移动={
学位：30，
金额：50
}
var ctx=document.querySelector（“canvas”）.getContext（“2d”）；
（函数循环（）{
ctx.clearRect（0,0,300,150）；
var ship={//重置演示的装运位置
x:100，
y:90
}
ctx.strokeRect（x-2号船，y-2号船，4号船，4号船）；
ctx.fillText（“From”，ship.x+5，ship.y）；
变量角度=（移动角度-90）/180*Math.PI；//补偿角度-90°，转换为弧度
ship.x+=movement.amount*Math.cos（角度）；//移动船舶
ship.y+=移动量*数学sin（角度）；
ctx.strokeRect（x-2号船，y-2号船，4号船，4号船）；
ctx.fillText（移动角度+“°”，船x+5，船y）；
运动.degrees++；
movement.degrees=movement.degrees%360；
请求动画帧（循环）；
})();
是的，JavaScript中的所有角度都以弧度为单位。此外，画布上下文右侧有0°点，因此如果希望0°笔直向上，则需要从所有角度减去90°：

var angle = (movement.degrees - 90) / 180 * Math.PI;  // compensate angle -90°, conv. to rad
ship.x += movement.amount * Math.cos(angle);          // move ship
ship.y += movement.amount * Math.sin(angle);


var移动={
学位：30，
金额：50
}
var ctx=document.querySelector（“canvas”）.getContext（“2d”）；
（函数循环（）{
ctx.clearRect（0,0,300,150）；
var ship={//重置演示的装运位置
x:100，
y:90
}
ctx.strokeRect（x-2号船，y-2号船，4号船，4号船）；
ctx.fillText（“From”，ship.x+5，ship.y）；
变量角度=（移动角度-90）/180*Math.PI；//补偿角度-90°，转换为弧度
ship.x+=movement.amount*Math.cos（角度）；//移动船舶
ship.y+=移动量*数学sin（角度）；
ctx.strokeRect（x-2号船，y-2号船，4号船，4号船）；
ctx.fillText（移动角度+“°”，船x+5，船y）；
运动.degrees++；
movement.degrees=movement.degrees%360；
请求动画帧（循环）；
})();
您正在寻找的技术是极坐标和笛卡尔坐标之间的转换。@这里的Sam没有极坐标，只是角度和距离move@hindmost我不确定我是否理解你。一个角度和一个距离如何不构成一组极坐标？你要寻找的技术是极坐标和笛卡尔坐标之间的转换。@这里没有极坐标，只有角度和到的距离move@hindmost我不确定我是否理解你。角度和距离如何不构成一组极坐标？请记住画布中的0°是向右的，而不是向上的。请记住画布中的0°是向右的，而不是向上的。为了澄清，减去90°是为了按照OP的要求将0°作为“直线向上”。为了澄清，减去90°是为了将0°作为“直线向上”按照OP的要求“直接向上”。