计算轨道物体的位置 [英] Calculate the position of an orbiting object

问题描述

我正在使用画布创建太阳系动画，并且在计算对象的位置（x，y）值时遇到问题。

地球绕太阳公转，而且我需要计算并更新每帧地球的位置。然后使用地球的位置，使月球绕地球旋转。

相关的功能是：

  orbitAround：函数（master）{
 master.makeOrbitCenter（）; 
 this.increaseOrbitAngle（）; 
 context.rotate（this.orbit.angle * Math.PI / 180）; 
 context.translate（this.orbit.distance，0）; 
 
 //计算并更新地球
的X和Y位置//这样月球就可以绕地球
绕轨道//这是地球$ b $的初始值b this.position.x = master.position.x + this.orbit.distance; 
 this.position.y = master.position.y; 
}，
  

中给定角度。

因此，要获取45度角的位置，本质上首先需要计算弧度的等效弧度。

  var degree = 45; 
 var radians =度*（Math.PI / 180）; 
  

这里的结果是0.785398163。然后，您可以使用以下方法获取绕行物体的 x 和 y 坐标：

  var x = Math.cos（0.785398163）*距离; 
 var y = Math.sin（0.785398163）*距离; 
  

单个框架的整个过程如下：

 可变距离= 100; //从轨道中心
 var度= 45; //绕360度轨道
 var radians =度*（Math.PI / 180）； 
 
 var x = Math.cos（radians）*距离; 
 var y = Math.sin（弧度）*距离; 
  

这是一个非常基本的摆弄小行星，上面放着正方形的行星和所有东西。

I'm creating a solar system animation using canvas and have a problem calculating an object's position (x,y) values.

Earth is orbiting around the Sun, and I need to calculate and update the Earth's position at each frame. And using Earth's position, I'll orbit the Moon around the Earth.

The related function is this:

orbitAround : function (master) {
    master.makeOrbitCenter();
    this.increaseOrbitAngle();
    context.rotate(this.orbit.angle * Math.PI/180);
    context.translate(this.orbit.distance, 0);

    // calculate and update the X and Y position of the earth
    // so that luna can orbit around earth
    // these are the initial values of earth
    this.position.x = master.position.x + this.orbit.distance;
    this.position.y = master.position.y;
},

Fiddle demo

To make it simpler, I've drawn this picture

Let's say the blue disc is the Earth, and is located at (300,200). The Sun is at (200,200) and the distance between them is 100. After the Earth makes a 45 degree rotation around the Sun, what would its position be? How can I calculate it using the given values?

解决方案

It looks like you've got something working there, but here's a breakdown:

Math.cos and Math.sin return a theoretical x and y position along an axis. They need to be given the angle in radians.

So, in order to get the position of a 45 degree angle, you essentially need to calculate the radian equivalent of degrees first.

var degrees = 45;
var radians = degrees * (Math.PI / 180);

The result here is 0.785398163. You can then get the x and y coordinate of the orbiting object using this:

var x = Math.cos(0.785398163) * distance;
var y = Math.sin(0.785398163) * distance;

The whole process for a single frame would look like this:

var distance = 100; // from the centre of orbit
var degrees = 45; // around a 360 degree orbit
var radians = degrees * (Math.PI / 180);

var x = Math.cos(radians) * distance;
var y = Math.sin(radians) * distance;

Here's a very basic fiddle with square planets and everything.

这篇关于计算轨道物体的位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！