<canvas id="Canvas2" onmousedown="cg()"></canvas>
<button type="button" onclick="ADDnumlimit()">Add ball!</button><br>
<a onclick="_control()">一个完全不成熟的物理模型</a>
<script>
    window.requestAnimFrame=
        window.requestAnimationFrame||
        window.webkitRequestAnimationFrame||
        window.mozRequestAnimationFrame||
        window.oRequestAnimationFrame||
        window.msRequestAnimationFrame||
        function(callback){window.setTimeout(callback, 1000/60);};
    var cancelAnimationFrame=window.cancelAnimationFrame||window.mozCancelAnimationFrame;
    var _W=150,_H=150;
    var _ca=document.getElementById("Canvas2"),_el=_ca.getContext("2d");
    var _num=0,G=0.01,Wi=0.01,Ff=0.99,R=5,NUMlimit=1;
    var _x=new Array(),_y=new Array(),speedx=new Array(),speedy=new Array(),m=new Array(),_timer;
    _ca.width=_W;_ca.height=_H;
    /*_ca.addEventListener("mousedown",function(event){
    },false);*/
    function cg(){
        for (var i=0;i<num;i++)
        speedx[i]+=RandomReal(-5,5),speedy[i]+=RandomReal(-5,5);
    }
    var sta=0;
    function ADDnumlimit(){if(sta==1&&NUMlimit<20)NUMlimit++;}
    function max(A,B){return A>B?A:B;}
    function ADDball(){
        _x.push(RandomNum(0,_W-R*2));
        _y.push(0);
        m.push(RandomReal(3,100));
        speedx.push(RandomReal(0,4));speedy.push(RandomReal(0,4));
        for (;;){
            var i;
            for (i=0;i<_num;i++) if (dis(_x[i],_y[i],_x[_num],_y[_num])<R*2) break;
            if (i==_num) break;
            _x[_num]=RandomNum(0,_W-R*2);
        }
        _num++;
    }
    function _work(timestamp){
        if (_num<NUMlimit) ADDball();
        _el.clearRect(0,0,_W,_H);
        for (var i=0;i<_num;i++)
        for (var j=i+1;j<_num;j++)
        if ((SS=dis(_x[i]+speedx[i],_y[i]+speedy[i],_x[j]+speedx[j],_y[j]+speedy[j]))<=R*2){
            var dx=_x[i]-_x[j],dy=_y[i]-_y[j],vx,vy;
            var F=2*(dx*(speedx[j]-speedx[i])+dy*(speedy[j]-speedy[i]))/(dx*dx+dy*dy)/(1/m[i]+1/m[j]);
            //F*=(R*2-SS)*(R*2-SS)*(R*2-SS)*0.000005+1;
            var E=m[i]*(speedx[i]*speedx[i]+speedy[i]*speedy[i])+m[j]*(speedx[j]*speedx[j]+speedy[j]*speedy[j]);
            var Wx=m[i]*speedx[i]+m[j]*speedx[j];
            var Wy=m[i]*speedy[i]+m[j]*speedy[j];
            speedx[i]+=F*dx/m[i];
            speedy[i]+=F*dy/m[i];
            speedx[j]-=F*dx/m[j];
            speedy[j]-=F*dy/m[j];
        }
        for (var i=0;i<_num;i++){
            speedx[i]*=Ff;speedy[i]*=Ff;
            _x[i]+=speedx[i];
            _y[i]+=speedy[i];
            speedy[i]+=G;
            speedx[i]+=Wi/m[i];
            if (_y[i]+speedy[i]+2*R>=_H&&speedy[i]>=0) speedy[i]*=-Ff,speedy[i]-=0;
            if (_y[i]+speedy[i]<0&&speedy[i]<=0) speedy[i]*=-Ff,speedy[i]+=0;
            if (_x[i]+speedx[i]+2*R>=_W&&speedx[i]>=0) speedx[i]*=-Ff,speedx[i]-=0;
            if (_x[i]+speedx[i]<0&&speedx[i]<=0) speedx[i]*=-Ff,speedx[i]+=0;
        }
        _el.fillStyle="black";
        for (var i=0;i<_num;i++){
            _el.beginPath();
            _el.arc(_x[i]+R,_y[i]+R,R,0,Math.PI*2);
            _el.closePath();
            _el.fill();
        }
        _timer=requestAnimationFrame(_work);
    }
    function _control(){
        if (sta==1){
            cancelAnimationFrame(_timer);
            sta=0;
        }else{
            _timer=requestAnimationFrame(_work);
            sta=1;
        }
    }
</script>