This commit is contained in:
Loic Guegan 2021-10-06 20:51:22 +02:00
parent 014dd0c6cc
commit ffd4ee4cc9
3 changed files with 32 additions and 14 deletions

View file

@ -2,28 +2,28 @@
<div class="col-sm">
<div class="input-group">
<div class="input-group-text">\(x_0\)</div>
<input type="number" class="form-control" v-model="x0" value="0">
<input type="number" class="form-control" v-model="x0">
<div class="input-group-text">\(m\)</div>
</div>
</div>
<div class="col-sm">
<div class="input-group">
<div class="input-group-text">\(y_0\)</div>
<input type="number" class="form-control" v-model="y0" value="50">
<input type="number" class="form-control" v-model="y0">
<div class="input-group-text">\(m\)</div>
</div>
</div>
<div class="col-sm">
<div class="input-group">
<div class="input-group-text">\(v_{0,x}\)</div>
<input type="number" class="form-control" v-model="vx0" value="50">
<input type="number" class="form-control" v-model="vx0" @input="v0_redraw">
<div class="input-group-text">\(m.s\)</div>
</div>
</div>
<div class="col-sm">
<div class="input-group">
<div class="input-group-text">\(v_{0,y}\)</div>
<input type="number" class="form-control" v-model="vy0" value="50">
<input type="number" class="form-control" v-model="vy0" @input="v0_redraw">
<div class="input-group-text">\(m.s\)</div>
</div>
</div>

View file

@ -10,7 +10,7 @@ let projectile= function (p){
let width=800
let height=300
let dots=[] // Dots that show the projectile path
let end=false;
p.end=false;
p.setup = function() {
c=p.createCanvas(Math.min(window.innerWidth,width), height);
@ -32,7 +32,7 @@ let projectile= function (p){
};
// See explanations in html
function xt(t) {
return x0+vx0*t
@ -46,29 +46,39 @@ let projectile= function (p){
function vy(t) {
return -g * t + vy0
}
p.v0_redraw=function(vx0,vy0){
p.draw(p.createVector(vx0,vy0))
}
let draw_vectors=function(x,y,skiparrow=false){
let draw_vectors=function(x,y,newV0,skiparrow=false){
p.push()
p.stroke(199, 141, 107)
draw_arrow(p,x,y,x+vx(t),y-vy(t),vt,c,skiparrow)
p.stroke(200)
draw_arrow(p,x0,height-y0,x,y,r,c,skiparrow)
p.stroke(181, 107, 199)
draw_arrow(p,x0,height-y0,x0+vx0,height-(y0+vy0),vy0t,c,skiparrow)
p.stroke(121, 199, 107)
draw_arrow(p,x0,height-y0,x0,height-y0-50,vj,c,skiparrow,true)
p.stroke(199,119,107)
draw_arrow(p,x0,height-y0,x0+50,height-y0,vi,c,skiparrow)
p.stroke(181, 107, 199)
if(newV0==null){
draw_arrow(p,x0,height-y0,x0+vx0,height-(y0+vy0),vy0t,c,skiparrow)
}
else{
draw_arrow(p,x0,height-y0,x0+newV0.x,height-(y0+newV0.y),vy0t,c,skiparrow)
}
p.pop()
}
p.draw = function() {
p.draw = function(newV0=null) {
p.clear()
let x=xt(t)
let y=yt(t)
@ -83,7 +93,7 @@ let projectile= function (p){
p.pop()
// Draw vectors
draw_vectors(x,y)
draw_vectors(x,y,newV0=newV0)
p.push()
p.stroke(0)
@ -92,12 +102,12 @@ let projectile= function (p){
// Check simulation state and update it
if(t>50 || (height-y0)<y){
end=true
p.end=true
p.noLoop()
}
// Update state
if(!end){
if(!p.end){
t+=0.1
dots.push([x,y])
}
@ -129,6 +139,13 @@ project_init=function(){
vy0:vy0,
vx0:vx0,
g:g
},
methods:{
v0_redraw:function(){
if(p5_instance.end){
p5_instance.v0_redraw(parseFloat(app.vx0),parseFloat(app.vy0))
}
}
}
})
p5Load()

View file

@ -47,6 +47,7 @@ do
sed -i "s#\${beautiful_name}#${beautiful_name}#g" $html
echo $html
# Create links
links_file=$(build_links $name)
sed -i "/\${LINKS}/r $links_file" $html