基于HTML5的小球物理测试系统，附实现原理

      上面这个式子比较长，其中首先通过1 - ballObj.elasticity根据小球的弹性获取一个系数，该系数越大，则小球速度减小得越多。(1 - ballObj.elasticity) * Math.abs(ballObj.dx))) 则是在获取到刚刚的系数之后，再和小球现在的速度相乘，得到小球碰撞后减少的速度值。由此可以发现，小球弹性越好（ballObj.elasticity越大），则所减少的速度越少，每次碰撞性能损耗越少。之后再通过乘以-1把速度方向取反。可以发现最后还需要把得出的值减1，和0比较取其较大的值，这是因为小球在不断和墙壁碰撞的过程中，由于每次都是以现有速度的百分比作为减少的速度，所以永远都不会为0，小球永远都不会停下。所以这里通过减1，使小球的速度小于1时，速度会自动变成0，使小球最终停下。

4.如果不是和左边墙壁发生碰撞，再同理判断是否和其它墙壁碰撞，若产生碰撞，照例需要改变nextX和nextY，dx或dy的值。

    /* 把小球绘制在canvas中 */
    var drawBallsToCanvas = function(ballArray, contextObj, backgroundColor, canvasWidth, canvasHeight, gravityValue, friction) {

    return function() {
        
            drawBackground(contextObj, backgroundColor, canvasWidth, canvasHeight);

            for (var i = 0, len = ballArray.length; i < len; i++) {
                contextObj.beginPath(); debugger;
                contextObj.fillStyle = ballArray[i].color;
                contextObj.arc(ballArray[i].currentX, ballArray[i].currentY, ballArray[i].radius, 0, 2 * Math.PI, false);

                contextObj.fill();
                contextObj.closePath();

                updateBallState(ballArray[i], canvasWidth, canvasHeight, gravityValue, friction);
               

            }
        }
    };

（编辑：晋中站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!