Jump to content

Parallelogram Law Summations

Professional Strawman
 Share

Recommended Posts

Professional Strawman

Professional Strawman

Posted
Posted (edited)

Hi all. I am looking to plot a graph of the Parallelogram Law summations shown in the link below. I am not sure how to do this, since the vector g, needs to continuously point to the origin after each summation. Does anyone here know how to do this or on what platform to do this?

 

Using the graph, one can determine the rate of precession per revolution. Also the vector, g, needs to incorporate the inverse square law. The initial velocity is something the user determines. The rest should be done by the software. Thanks in advance for the help.

 

http://3.bp.blogspot.com/-tFDkItTrHWY/Ug-bh0x_NRI/AAAAAAAAE6U/PKx81419uBA/s1600/Kepler

 

For some background on the question, please see the link below.

 

http://www.scienceforums.net/topic/88054-parallelogram-law-summations-precession-of-orbits/

 

------

 

The precession looks like the images in the following links.

 

http://www.rkm.com.au/ANIMATIONS/animation-graphics/Black-Hole-Rosette-Orbit-label.png

http://www.relativity.li/en/epstein2/read/i0_en/i1_en/

Edited by Goeton
Link to comment
Share on other sites
fiveworlds

fiveworlds

Posted
Posted (edited) 
    <canvas id="myCanvas" width="578" height="700"></canvas>
    <script>
    function drawparallelogram(ax,ay,bx,by,cx,cy,dx,dy,canvasid,context){
    var atob= Math.sqrt( (bx-ax)*(bx-ax) + (by-ay)*(by-ay) );
    var atoc= Math.sqrt( (cx-ax)*(cx-ax) + (cy-ay)*(cy-ay) );
    var ctod= Math.sqrt( (cx-dx)*(cx-dx) + (cy-dy)*(cy-dy) );
    var dtob= Math.sqrt( (bx-dx)*(bx-dx) + (by-dy)*(by-dy) );
    var ctob= Math.sqrt( (bx-cx)*(bx-cx) + (by-cy)*(by-cy) );
    if (atob===ctod && atoc===dtob){
    //only runs if points equal a paralleogram
      var canvas = document.getElementById(canvasid);
      var context = canvas.getContext(context);
      context.beginPath();
            context.moveTo(cx, cy);      
            context.lineTo(bx, by);//c>b
            context.moveTo(bx, by);
            context.lineTo(dx, dy);//d>b
        context.moveTo(dx, dy);
        context.lineTo(cx, cy);//c>d
        context.moveTo(ax, ay);
        context.lineTo(cx, cy);//a>c
        context.moveTo(ax, ay);
        context.lineTo(bx, by);//a > b
        context.fillText(atoc,((ax+cx)/2)-10,((ay+cy)/2)-10);
        context.fillText(dtob,((dx+bx)/2)-10,((dy+by)/2)-10);
        context.fillText(ctod,((dx+cx)/2)-10,((dy+cy)/2)-10);
        context.fillText(atob,((bx+ax)/2)-10,((by+ay)/2)-10);
        context.fillText(ctob,((bx+cx)/2)-10,((by+cy)/2)-10);
      context.stroke();}
      }
      var a=100;
      var b=50;
      var c=100;
      var d=150;
      while (a<400){
      
      drawparallelogram(a,b,450,50,c,d,450,150,'myCanvas','2d');
    a=a+10;
    b=b+10;
    c=c+10;
    d=d+10;
            }
    </script>

If you wanted all parallelogram diagonals to be the same length you would need to use the formula to find a point on the circle

Edited by fiveworlds
Link to comment
Share on other sites
Professional Strawman

Professional Strawman

Posted
  • Author
Posted (edited)

Thanks fiveworlds, for your program. I tried on it an online html platform and I did not see an orbit/graph. How do I run this program?


Also, the diagonals should not be of equal lengths and they won't since Kepler's 2nd law is inherent in this Summation method. That is, at the farther point in the orbit, relative to the origin, the diagonals will get smaller and become longer at the nearest points. So you can ignore the length of the diagonals.

Edited by Goeton
Link to comment
Share on other sites
Sensei

Sensei

Posted
Posted (edited)

Thanks fiveworlds, for your program. I tried on it an online html platform and I did not see an orbit/graph. How do I run this program?

 

fiveworlds has habit of giving chunks of code that doesn't work to any post..

 

You need html body tags:

<html>
<body>
 <canvas id="myCanvas" width="578" height="700"></canvas>
    <script>
    function drawparallelogram(ax,ay,bx,by,cx,cy,dx,dy,canvasid,context){
    var atob= Math.sqrt( (bx-ax)*(bx-ax) + (by-ay)*(by-ay) );
    var atoc= Math.sqrt( (cx-ax)*(cx-ax) + (cy-ay)*(cy-ay) );
    var ctod= Math.sqrt( (cx-dx)*(cx-dx) + (cy-dy)*(cy-dy) );
    var dtob= Math.sqrt( (bx-dx)*(bx-dx) + (by-dy)*(by-dy) );
    var ctob= Math.sqrt( (bx-cx)*(bx-cx) + (by-cy)*(by-cy) );
    if (atob===ctod && atoc===dtob){
    //only runs if points equal a paralleogram
      var canvas = document.getElementById(canvasid);
      var context = canvas.getContext(context);
      context.beginPath();
            context.moveTo(cx, cy);      
            context.lineTo(bx, by);//c>b
            context.moveTo(bx, by);
            context.lineTo(dx, dy);//d>b
        context.moveTo(dx, dy);
        context.lineTo(cx, cy);//c>d
        context.moveTo(ax, ay);
        context.lineTo(cx, cy);//a>c
        context.moveTo(ax, ay);
        context.lineTo(bx, by);//a > b
        context.fillText(atoc,((ax+cx)/2)-10,((ay+cy)/2)-10);
        context.fillText(dtob,((dx+bx)/2)-10,((dy+by)/2)-10);
        context.fillText(ctod,((dx+cx)/2)-10,((dy+cy)/2)-10);
        context.fillText(atob,((bx+ax)/2)-10,((by+ay)/2)-10);
        context.fillText(ctob,((bx+cx)/2)-10,((by+cy)/2)-10);
      context.stroke();}
      }
      var a=100;
      var b=50;
      var c=100;
      var d=150;
      while (a<400){
      
      drawparallelogram(a,b,450,50,c,d,450,150,'myCanvas','2d');
    a=a+10;
    b=b+10;
    c=c+10;
    d=d+10;
            }
    </script>
 </body></html>

and save it as index.html

 

Either in Firefox and Chrome it renders this image:

post-100882-0-93099300-1426154208_thumb.png

 

I don't think so it's correct result.

Edited by Sensei
Link to comment
Share on other sites
fiveworlds

fiveworlds

Posted
Posted (edited)
Either in Firefox and Chrome it renders this image:

 

It used to be that way update your other browsers internet explorer, opera etc support canvas now.

while (a<400){

drawparallelogram(a,b,450,50,c,d,450,150,'myCanvas','2d');
a=a+10;
b=b+10;
c=c+10;
d=d+10;
}

take this and use just

      var a=100;
      var b=50;
      var c=100;
      var d=150;

      drawparallelogram(a,b,450,50,c,d,450,150,'myCanvas','2d');

gives just one paralleogram on it's own. and if you just want one diagonal line pointing to origin

An5UT8Q.jpg?1?2726

 

use

            context.beginPath();
            context.moveTo(cx, cy);      
            context.lineTo(bx, by);//c>b


        context.fillText(ctob,((bx+cx)/2)-10,((by+cy)/2)-10);
      context.stroke();}

I am using points a>b for the top of paralleogram and c>d for the bottom of the paralleogram which is I am also labeling the line lengths using context.fillText if you don't want the labels just delete that

R8RTNt2.jpg?1

 

Further explained

drawparallelogram(point ax,point ay,point bx,point by,point cx,point cy,point dx,point dy,'myCanvas','2d');

Edited by fiveworlds
Link to comment
Share on other sites
Professional Strawman

Professional Strawman

Posted
  • Author
Posted (edited)

fiveworlds, many thanks for your explanation. You clearly misunderstood my drawing. The diagonals are the bold arrows in the drawing. Do you notice the black bold arrows in my drawing? [this drawing is also my profile picture]

 

http://3.bp.blogspot.com/-tFDkItTrHWY/Ug-bh0x_NRI/AAAAAAAAE6U/PKx81419uBA/s1600/Kepler%27s+Second+Law_4.bmp

 

At 1, you see the arms of the parallelogram: v and g. Therefore the diagonal is r. I use the resultant r, at 2, and point g towards the origin and get the diagonal again and so.

 

Sensei, I think fiveworlds misunderstood my drawing.

Edited by Goeton
Link to comment
Share on other sites
fiveworlds

fiveworlds

Posted
Posted (edited)

I am sorry I am quite busy at the moment can you show me how far you have gotten with canvas? below is a function to return the exact point of click

<script>

function show_coords(event)
{

    var x,y;
    if (event.pageX != undefined && event.pageY != undefined)
    {
        x = event.pageX;
        y = event.pageY;
    }
    else
    {
        x = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
        y = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;
    }
    
    x=parseInt(x)- parseInt(document.getElementById('canvas').offsetLeft);
    y=parseInt(y)-parseInt(document.getElementById('canvas').offsetTop);
    document.getElementById("demo").innerHTML =    "X= " + x + "<br>Y= " + y;
    
}

</script>
</head>

<body>

<canvas id="canvas" style="margin-top:-9px;top:0px;left:0px;" onmousedown="show_coords(event)" width="1000px" height="1000px"></canvas>

</body>

this should give you an idea of some of the gravity simulations possible with canvas http://www.arachnoid.com/orbital_dynamics/index.html

http://jarrodoverson.com/static/demos/particleSystem/#0,variable:Sv1%285000|1|0|0|1|E388,158:2,0:8:-1:0.10:4|F443,211:500%29

http://www.arachnoid.com/graphinity_online/index.html

Edited by fiveworlds
Link to comment
Share on other sites
Professional Strawman

Professional Strawman

Posted
  • Author
Posted (edited)

fiveworlds, I tried and learned a little canvas, but I was never going to automate this. But the Excel program works exactly right. My summation method is equivalent to the Leapfrog method, so that was just the program I was looking for. So I found what I was looking for. Many thanks for trying.

 

If you want to see other Excel programs, here they are:

http://galileo.phys.virginia.edu/classes/581/

Edited by Professional Strawman
Link to comment
Share on other sites
fiveworlds

fiveworlds

Posted
Posted
fiveworlds, I tried and learned a little canvas, but I was never going to automate this. But the Excel program works exactly right. My summation method is equivalent to the Leapfrog method, so that was just the program I was looking for. So I found what I was looking for. Many thanks for trying.

 

I need to learn excel too you know I am just teaching you something that I know. For instance I know that in order to map 2d equations onto a graph I need to be able to convert the canvas into the normal 2d axis. Like so

 

 

<script>

 

function show_coords(event)

{

 

var x,y;

if (event.pageX != undefined && event.pageY != undefined)

{

x = event.pageX;

y = event.pageY;

}

else

{

x = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;

y = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;

}

x=parseInt(x)- parseInt(document.getElementById('canvas').offsetLeft);

y=parseInt(y)-parseInt(document.getElementById('canvas').offsetTop);

x=x-parseInt(canvas.width)/2;

y=parseInt(canvas.height)/2-y;

document.getElementById("demo").innerHTML = "X= " + x + "<br>Y= " + y;

}

 

</script>

</head>

 

<body>

 

<canvas id="canvas" style="margin-top:-9px;top:0px;left:0px;" onmousedown="show_coords(event)" width="1000px" height="1000px"></canvas>

 

</body>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.