projects/projectile/index.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65


let t=0;
let v0=50
let x0=0
let y0=50
let g=9.81

let projectile= function (node){

    node.setup = function() {
        node.createCanvas(width, height);
    };
    let width=800
    let height=300


    let dots=[]
    function x(t) {
        return x0+v0*t
    }

    function y(t) {
        return height - (-1/2 * g * t**2 + v0 * t + y0)
    }

    node.draw = function() {
        node.background(50);
        node.noStroke();
        dots.forEach((elt)=>{node.ellipse(elt[0],elt[1],5,5);})
        node.ellipse(x(t),y(t),20,20);
        dots.push([x(t),y(t)])
        if(t>50 || y(t)>height){
            node.noLoop()
        }
        t+=0.06
    };
};

refresh=function(){
    t=0
    x0=parseFloat(app.x0)
    y0=parseFloat(app.y0)
    v0=parseFloat(app.v0)
    g=parseFloat(app.g)
    console.log(app.x0)
    p5Load()
}


project_init=function(){
    app = new Vue({
        el: '#app',
        data :{
            x0:x0,
            y0:y0,
            v0:v0,
            g:g
        }
    })
    p5Load()
    
}