diff options
Diffstat (limited to 'projects')
| -rw-r--r-- | projects/projectile/index.html | 6 | ||||
| -rw-r--r-- | projects/projectile/index.js | 42 |
2 files changed, 32 insertions, 16 deletions
diff --git a/projects/projectile/index.html b/projects/projectile/index.html index d56edd3..63d3938 100644 --- a/projects/projectile/index.html +++ b/projects/projectile/index.html @@ -34,7 +34,7 @@ <br /><br /><br /> <h3>Projectile Motion</h3> -<p>To determine to position of the projectile we should compute the position vector \(\vec{r}=x(t)\vec{i}+y(t)\vec{i}\).</p> +<p>To determine to position of the projectile we should compute the position vector \(\vec{r}(t)=x(t)\vec{i}+y(t)\vec{i}\).</p> <h5>\(x(t)\):</h5> <p>We know from Newton second law that \(\sum \vec{F} = m\times \vec{a}_x = m\times a_x(t)\vec{i}\)</p> <p>However, the projectile as a constant speed along \(\vec{i}\). Hence, \(a_x(t) = 0 \).</p> @@ -42,7 +42,9 @@ \[ x(t) = \int_{t_0}^t v_{0,x}dt = v_{0,x}t + C = v_{0,x}t + x_0\] <h5>\(y(t)\):</h5> <p>We know from Newton second law that \(\sum \vec{F} = m\times \vec{a}_y = m\times a_y(t)\vec{i}\)</p> -<p>The projectile is under the influence of the gravity that is oriented <em>downwarde</em>. Hence, \(a_y(t) = -g \).</p> +<p>The projectile is under the influence of the gravity that is oriented <em>downward</em>. Hence, \(a_y(t) = -g \).</p> <p>Thus:</p> \[ v_y(t) = \int_{t_0}^t a_{y}(t)dt = -gt+C = -gt + v_{0,y}\] \[ y(t) = \int_{t_0}^t v_y(t)dt = -\frac{1}{2}gt^2 + v_{0,y}t+C=-\frac{1}{2}gt^2 + v_{0,y}t+y_0\] +<h5>\(\vec{r}(t)\):</h5> +Finally knowing \(x(t)\) and \(y(t)\) we have \( \vec{r}(t) = \left(\begin{smallmatrix}x(t)\\y(t)\end{smallmatrix}\right) = \left(\begin{smallmatrix}v_{0,x}t + x_0\\-\frac{1}{2}gt^2 + v_{0,y}t+y_0\end{smallmatrix}\right)\) diff --git a/projects/projectile/index.js b/projects/projectile/index.js index f27f474..864384b 100644 --- a/projects/projectile/index.js +++ b/projects/projectile/index.js @@ -1,8 +1,8 @@ let t=0; let v0=50 -let x0=50 -let y0=50 +let x0=60 +let y0=60 let g=9.81 let projectile= function (node){ @@ -12,9 +12,19 @@ let projectile= function (node){ node.setup = function() { c=node.createCanvas(Math.min(window.innerWidth,width), height); - v0t=node.createElement('p', ''); + + v0t=node.createElement('span', ''); katex.render("v_0", v0t.elt); - v0t.elt.style.color="#b4b4b4" + v0t.elt.style.color="white" + + r=node.createElement('span', ''); + katex.render("\\vec{r}(t)", r.elt); + r.elt.style.color="white" + + vt=node.createElement('span', ''); + katex.render("v(t)", vt.elt); + vt.elt.style.color="white" + }; // See explanations @@ -26,6 +36,10 @@ let projectile= function (node){ return height - (-1/2 * g * t**2 + v0 * t + y0) } + function v(t) { + return (-g * t + v0) + } + node.draw = function() { node.background(70); @@ -35,23 +49,23 @@ let projectile= function (node){ node.ellipse(x(t),y(t),20,20); node.fill(255) dots.push([x(t),y(t)]) - if(t>50 || y(t)>height){ - node.noLoop() - } - t+=0.05 node.push() node.fill(22) node.stroke(180) - m=draw_arrow(node,x0,height-y0,x0+v0,height-y0-v0) - console.log(m.y) - v0t.position(c.position().x+m.x,c.position().y+m.y) - node.pop() + draw_arrow(node,x(t),y(t),x(t)+x0,y(t)-v(t),vt,c) + draw_arrow(node,x0,height-y0,x(t),y(t),r,c) + draw_arrow(node,x0,height-y0,x0+v0,height-(y0+v0),v0t,c) + if(t>50 || (height-y0)<y(t)){ + node.stop() + } + t+=0.05 }; node.windowResized = function(){ - v0t.position(c.position().x+m.x,c.position().y+m.y) node.resizeCanvas(Math.min(window.innerWidth,width), height); - + draw_arrow(node,x(t),y(t),x(t)+x0,y(t)-v(t),vt,c,true) + draw_arrow(node,x0,height-y0,x(t),y(t),r,c,true) + draw_arrow(node,x0,height-y0,x0+v0,height-(y0+v0),v0t,c,true) } }; |