возникли проблемы с получением координат круга - PullRequest
Новая
       13

возникли проблемы с получением координат круга

1 голос
/ 19 января 2010

Я пытаюсь использовать приведенный здесь пример: http://www.physicsforums.com/showthread.php?t=248191

Я написал простой javascript, который использует преимущества этого примера (или, по крайней мере, я намеревался это сделать), однако я совершенно сбит с толку тем, как он реагирует на то, что я задаю в качестве угла. Я ожидаю, что он будет вести себя там, где (при условии, что мы используем полярные координаты), если я использую 0 в качестве угла, точка должна быть на восточной стороне круга, 90 на юге, 180 на западе. Однако это совсем не так, как работает. Я даже не могу объяснить, что он делает. Похоже, обойти круг от 0 до 4,7 или около того. Конечно, возможно (вероятно, даже), что я полностью испортил это и упускаю что-то действительно очевидное.

Во всяком случае ... мой код ниже полностью. чтобы запустить его, просто вырезать и вставить в новый документ .html. Мне действительно любопытно, что я делаю не так. 

<HTML>

<script>
startMotion = function(){
    setInterval("moveDots()", 1000);
}

function moveDots(){
    oDot = document.getElementById("oDot");
    iDot = document.getElementById("iDot");
    tDisplay = document.getElementById("tDisplay");



    oDot.style.left = (t1Radius*(Math.cos(angle)) + ccX)+ "px"
    oDot.style.top = (t1Radius*(Math.sin(angle)) + ccY)+ "px"

    iDot.style.left = (t2Radius*(Math.cos(angle)) + ccX) + "px"
    iDot.style.top = (t2Radius*(Math.sin(angle)) + ccY)+ "px"

    tDisplay.value = "x=" + iDot.style.left + "\n";
    tDisplay.value += "y=" + iDot.style.top + "\n";
    tDisplay.value += "angle=" + angle + "\n";

    angle += angleSpeed;
    angle %= 360;
}

var angleSpeed = 5; //amount of change in angle from animation point to animation point
var ccX = 200; //circle center coordinate X
var ccY = 200; //circle center coordinate Y
var t1Radius = 200; //radius for outside dot
var t2Radius = 100; //radius for inside dot
var angle = 0; //this number will keep changing to move the dots around the circumference 

</script>


<style>
body{

    text-align:center;
    margin:0;
}
#track{
    margin: 0 auto; 
    text-align: left; 
    position: relative;
    width:400px;
    height:400px; 
    background-color:pink;
}
#iDot{
    position:absolute;
    top:0px;
    left:0px;   
    width:10px;
    height:10px;
    background-color:green;
}
#oDot{
    position:absolute;
    top:0px;
    left:0px;
    width:10px;
    height:10px;
    background-color:blue;
}
#feedback{
    position:absolute;
    left:0px;
    top:0px;
    width:200px;
    height:100px;
    background-color:black;

}
#tDisplay{
    background-color:black;
    color:white;
    font-size:10px;
    font-family:arial, helvetica;
    width:300px;
    height:100px;
}
#center{
position:absolute;
left:195px;
top:195px;
width:10px;
height:10px;
background-color:white;
}
</style>
<body onLoad="startMotion()">
<div id="feedback">
    <textarea id="tDisplay"></textarea>
    </div>
<div id="track">
    <div id="center"></div>
    <div id="iDot"></div>
    <div id="oDot"></div>

</div>
</body>

</html>

Ответы [ 5 ]

4 голосов
/ 19 января 2010

Вам нужно использовать радианы, а не градусы. Умножьте на коэффициент pi / 180, чтобы преобразовать: 

var theta = angle * Math.PI / 180;
oDot.style.left = (t1Radius*(Math.cos(theta)) + ccX)+ "px"
// ...
4 голосов
/ 19 января 2010

Math.cos() и его родственники ожидают радианы , а не градусы.Вы можете преобразовать градусы в радианы, умножив на π, а затем разделив на 180. (2π радиан = 360 градусов)

3 голосов
/ 19 января 2010

Сначала необходимо преобразовать угол из градусов в радианы. 

 function moveDots(){
     var rad_angle = angle * Math.PI / 180;
     ...
     ... Math.cos(rad_angle) ...
 }
2 голосов
/ 19 января 2010

Тригонометрические функции в JavaScript рассчитывают углы в радианах, вы должны преобразовать значения градусов в радианы, прежде чем вызывать их.

Вы можете сделать это легко, просто умножьте число в градусах на π/180, то есть простую функцию: 

function toRad(deg) {
  return deg * Math.PI / 180;
}

Потому что:

formula
(источник: krellinst.org )

0 голосов
/ 19 января 2010

Кевин ответ правильный, но неполный. Javascript использует радианы, а не градусы.

При измерении в градусах круг составляет 360 градусов.

Когда вы измеряете с радианами, в круге есть 2 * пи радианы.

Чтобы преобразовать градусы в радианы, умножьте на 2 * pi / 360 или приблизительно 0,017453.

...