用HTML5中的Canvas结合公式绘制粒子运动的教程

        var osCtx = this.osCanvas.getContext("2d");   
    
        this.osCanvas.width = 1000;   
        this.osCanvas.height = 150;   
    
        osCtx.textAlign = "center";   
        osCtx.textBaseline = "middle";   
        osCtx.font="70px 微软雅黑,黑体 bold";   
        osCtx.fillStyle = "#1D181F"  
        osCtx.fillText("WelCome" , this.osCanvas.width/2 , this.osCanvas.height/2-40);   
        osCtx.fillText("To wAxes’ HOME" , this.osCanvas.width/2 , this.osCanvas.height/2+40);   
        var bigImageData = osCtx.getImageData(0,0,this.osCanvas.width,this.osCanvas.height);   
    
        dots = [];   
    
        for(var x=0;x<bigImageData.width;x+=2){   
            for(var y=0;y<bigImageData.height;y+=2){   
                var i = (y*bigImageData.width + x)*4;   
                if(bigImageData.data[i+3]>128){   
                    var dot = new Dot(   
                        Math.random()>0.5?Math.random()*20+10:Math.random()*20+canvas.width-40,   
                        -Math.random()*canvas.height*2,   
                        0,   
                        0,   
                        x+(canvas.width/2-this.osCanvas.width/2),