iframe-proxy | Sunbelt Computer Software

107 lines (89 loc) · 2.84 KB

    <title>String</title>
    <script src="./vecalc.js"></script>
    <script src="3dlib.js"></script>
    <script src="./graph.js"></script>
<body style="background: #888">
    <div style="background: #fff">
        <canvas id="cnv" width="1000" height="500" onmousemove="onMouseMove(event)"></canvas>
    <script>
        let y0 = 0;
        function onMouseMove(event) {
            y0 = -(event.clientY - event.target.clientHeight / 2) / 32;
        //All the unit is meter, second and gram.
        var xs = []
        var vs = []
        var as = []
        function addParticle(x) {
            xs.push(x)
            vs.push([0, 0])
            as.push([0, 0])
        //Update position from velocity and acceleration
        function updatePosition(dt) {
            as.map((a, i) => {
                vs[i] = add(vs[i], mul(a, dt))
                xs[i] = add(xs[i], mul(vs[i], dt))
        function stringMove(k, dt) {
            xs.map((x, i) => {
                if (xs[i - 1]) {
                    a = add(a, mul(sub(xs[i - 1], x), k))
                if (xs[i + 1]) {
                    a = add(a, mul(sub(xs[i + 1], x), k))
                // Gravity
                a = add(a, mul([0, -9.8], dt))
                // Drag
                a = add(a, mul(vs[i], - dt * 8))
                as[i] = a
            updatePosition(dt)
        //Generate graph instance
        const graph = getGraph2D(cnv)
        function draw() {
            graph.clear()
            graph.lines = [xs]
            graph.render()
        var number = 100 // Number of particle
        var length = 20 // Length of string
        // Generate paritcle
        for (var i = 0; i < number; i++) addParticle([i * length / number - length / 2, 0])
        var t = 0       //Current time
        var dt = 0.01   //Delta time
        var k = 400     //Spring constant
        let y0_ = 0;
        let k2 = dt * 0.5;
        setInterval(() => {
            for (let _ = 0; _ < 3; _++) {
                // s = [-length / 2, 0]
                // s = [-length / 2, Math.sin(Math.PI * 2 * t * 1.2 / 6)]
                // s = [-length / 2, 1 / (1 + Math.pow((t - 15) * 3, 2))]
                y0_ = y0_ * (1 - k2) + y0 * k2
                s = [-length / 2, y0_]
                // Fix position
                xs[0] = s
                xs[number - 1][0] = length / 2
                // xs[number - 1][1] = 0
                // Apply diffential equation
                stringMove(k, dt)
                xs[0] = s
                xs[number - 1][0] = length / 2
                xs[number - 1][1] = 0
                //Render
                draw()
                t += dt
        }, 0);
    </script>

Sunbelt Computer Software

PL/B Language Development and Support

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Sunbelt Computer Software

PL/B Language Development and Support

FilesExpand file tree

string.html

Latest commit

History

string.html

File metadata and controls