physics-simulations

commit ebf2c9b7cd65f0c3b3936d8999669688ae001aaa
parent 4350501edb8eb7cf730538cb047638a5784da3be
Author: ashermorgan <59518073+ashermorgan@users.noreply.github.com>
Date:   Sun,  9 May 2021 09:11:19 -0700

Add arrow to show projectile motion launch vector

Diffstat:
M
simulations/projectile-motion.html
 | 
4
++++
M
simulations/projectile-motion.js
 | 
28
+++++++++++++++++++++++++++-

2 files changed, 31 insertions(+), 1 deletion(-)
diff --git a/simulations/projectile-motion.html b/simulations/projectile-motion.html
@@ -73,6 +73,10 @@
                     <!-- Path -->
                     <circle v-for="position in positions" :cx="10*position.x" :cy="100 - 10*position.y" r="0.5" fill="#808080"></circle>
 
+                    <!-- Launch vector -->
+                    <line :x1="10*position.x" :y1="100 - 10*position.y" :x2="10*launchArrow[1].x" :y2="100 - 10*launchArrow[1].y"  stroke-width="1" stroke="#808080"></line>
+                    <path :d="`M${10*launchArrow[0].x} ${100 - 10*launchArrow[0].y} L${10*launchArrow[1].x} ${100 - 10*launchArrow[1].y} L${10*launchArrow[2].x} ${100 - 10*launchArrow[2].y} Z`" stroke="#808080" stroke-width="1" fill="#808080"/>
+
                     <!-- Projectile -->
                     <circle :cx="10*position.x" :cy="100 - 10*position.y" r="1" fill="#ff0000"></circle>
                 </svg>
diff --git a/simulations/projectile-motion.js b/simulations/projectile-motion.js
@@ -27,7 +27,7 @@ const App = {
         },
 
         /**
-         * The current velocity of the projectile.
+         * The current velocity of the projectile
          */
         velocity: function() {
             let x = this.getAdj(this.angle, this.initialVelocity);
@@ -36,6 +36,32 @@ const App = {
             let angle = total != 0 ? this.getAng(y, x) : 0;
             return {x, y, total, angle};
         },
+
+        /**
+         * The coordinates of the launch vector arrow
+         */
+        launchArrow: function() {
+            if (this.time !== 0 || this.initialVelocity === 0) {
+                return [
+                    this.position,
+                    this.position,
+                    this.position
+                ];
+            }
+            else {
+                let x = this.position.x + this.getAdj(this.angle, this.initialVelocity / 4 + 0.4);
+                let y = this.position.y + this.getOpp(this.angle, this.initialVelocity / 4 + 0.4);
+                let arrow1x = x - this.getAdj(this.angle + 20, 0.25);
+                let arrow1y = y - this.getOpp(this.angle + 20, 0.25);
+                let arrow2x = x - this.getAdj(this.angle - 20, 0.25);
+                let arrow2y = y - this.getOpp(this.angle - 20, 0.25);
+                return [
+                    { x: arrow1x, y: arrow1y },  // Arrow side #1
+                    { x: x,       y: y       },  // Center point
+                    { x: arrow2x, y: arrow2y },  // Arrow side #2
+                ];
+            }
+        }
     },
     methods: {
         /**