角速度应用:

 

             //获取到Canvas

            

var canvas = document.getElementById("stage");  

            

//

2d绘图版

            

var context = canvas.getContext("2d");  

            

//

球运行的速度

            

var ballSpeed=4;

            

            

            

//

字弹对象

            

var ball=

function(x,y,radius,color)

            {

                

this.x=x;

                

this.y=y;

                

this.radius=radius;

                

this.color=color;

                

//

绘制字弹

                

this.draw=

function()

                {    

                     

//

清空画板

                    context.save();        

                    context.beginPath();         

                    context.strokeStyle = 

this.color;

                    context.fillStyle = 

this.color;   

                    context.lineWidth = 5;                

                    context.arc(

this.x, 

this.y, 

this.radius, 0, 2 * Math.PI, 

false);  

                    context.closePath();                   

                    context.fill(); 

                    context.stroke();

                }

            }

            

            

            

//

中心点位置

            

var centerX=canvas.width/2;

            

var centerY=canvas.height/2;

            

            

//

创建球

            

var myBall=

new ball(centerX,centerY,10,"ff0000")

            myBall.draw();

            

            

var mouseX=centerX;

            

var mouseY=centerY;

            

//

添加按键事件

             canvas.addEventListener("mousemove", onMouseMove, 

false);  

             

             

//

记录鼠标移动到的位值

             

function onMouseMove(evt)

             {                              

                  mouseX=evt.layerX;

                 mouseY=evt.layerY;

             }            

            

            

//

动画处理

            

var drawAsync = eval(Jscex.compile("async", 

function () {

                            

                            

while(

true)

                            {    

                                context.clearRect(0, 0, canvas.width, canvas.height);                        

                                 

//

计算夹角

                                 

var dx=mouseX-myBall.x;

                                 

var dy=mouseY-myBall.y;                 

                                 

var angle=Math.atan2(dy,dx);

                                 

                                 

//

角速度

                                 myBall.x+=Math.cos(angle)*ballSpeed;

                                 myBall.y+=Math.sin(angle)*ballSpeed;                              

                                

//

重绘球

                                myBall.draw();                            

                                $await(Jscex.Async.sleep(1000/60));

                            }

                                   

                }));

                drawAsync().start();

 

作者：Louja

出处：http://loujady.cnblogs.com

本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此声明，且在文章页面给出原文连接，否则保留追究法律责任的权利。