window.onload = function(){								var ctx = document.getElementById(‘canvas1‘).getContext(‘2d‘)				//旋转				ctx.save()				ctx.translate(200,200)//把（200，200）点作为临时的（0，0）点				ctx.rotate(30*Math.PI/180)//顺时针旋转30度所对应的弧度				ctx.fillRect(0,0,100,150)				ctx.restore()			}

			/*				抛物线运动				这个版本做了修改，为了减少一次角度和弧度之间的转换计算（通过Math.atan2可以直接算出弧度），				构造参数中的角度改成了弧度				deleted:				angle = angle,								//初始角度				radians = angle*Math.PI/180,	//初始弧度				object ParabolicMotion					@velocity:初始速度					@radians:初始弧度					@gravity:初始加速度{x:0,y:2}			*/			function ParabolicMotion(velocity,radians,gravity){				var velocity = velocity, 						radians = radians, 						gravity = gravity	 				var offsetX = velocity*Math.cos(radians),						offsetY = -velocity*Math.sin(radians)				function next(offset,gravity){					var offset1 = offset					var offset2 = offset+gravity					return {offset:offset2,dv:(offset1+offset2)*.5}				}				return {					/*						获取运动轨迹到下一个时间点，x,y轴所偏移的距离					*/					moveNext : function(){						var offsetXD = next(offsetX,gravity.x)						var offsetYD = next(offsetY,gravity.y)												offsetX = offsetXD.offset						offsetY = offsetYD.offset						//console.log(offsetX+‘,‘+offsetY)												return {x:offsetXD.dv,y:offsetYD.dv}					}				}			}

			/*弹弓*/			function Slingshot(){				var opts,						ctx,						crtBall,						ballSelected = false				function refresh(){					ctx.clearRect(0,0,opts.width,opts.height)					drawSling()					crtBall.draw()									}				function drawSling(){					var point = opts.actionPoint					ctx.beginPath()					ctx.moveTo(point.x,point.y)					ctx.lineTo(point.x,opts.height)					ctx.closePath()					ctx.stroke()					if(crtBall!=null&&ballSelected){						//绘制连接球和弹弓的"橡皮筋"						ctx.beginPath()						ctx.moveTo(point.x,point.y)						ctx.lineTo(crtBall.x,crtBall.y)						ctx.closePath()						ctx.stroke()					}				}				function isBallSelected(offsetX,offsetY){					var point = opts.actionPoint					var a = Math.abs(point.x-offsetX)					var b = Math.abs(point.y-offsetY)					//var c = Math.sqrt(a*a+b*b)					return (a*a+b*b)<=crtBall.radius*crtBall.radius				}				// 添加拉弹弓事件				function initEvents(){						var canvas = opts.canvas						/*							addEventListener函数的第3个参数，							false表示内层元素事件先触发，ture则表示外层的事件先触发														alert(e.offsetX+‘,‘+e.offsetY)							必须使用offsetX，offsetX是相对于canvas画布的距离(但firefox不支持)							事件参数e没有考虑浏览器兼容问题						*/						canvas.addEventListener(‘mousedown‘,function(e){																					// 判断球是否被选中							ballSelected = isBallSelected(e.offsetX,e.offsetY)														if(ballSelected){								crtBall.locate(e.offsetX,e.offsetY)								refresh()															}						},false)						canvas.addEventListener(‘mousemove‘,function(e){							if(ballSelected){								crtBall.locate(e.offsetX,e.offsetY)								refresh()							}						},false)						canvas.addEventListener(‘mouseup‘,function(e){							if(ballSelected){								ballSelected = false								crtBall.locate(e.offsetX,e.offsetY)								refresh()											//发射炮弹								fire(function(x,y){									//TODO 判断是否打中目标								})															}						},false)				}				function fire(onCompleted){					// 获取当前的炮弹发射速度和弧度					var velocity = ($.square(opts.actionPoint.y-crtBall.y)+$.square(opts.actionPoint.x-crtBall.x))/100					var radians = -Math.atan2(opts.actionPoint.y-crtBall.y,opts.actionPoint.x-crtBall.x)//30*Math.PI/180					var gravity = {x:0,y:2}					var parabolicMotion = new ParabolicMotion(velocity,radians,gravity)					var completed = false					var timer =	setInterval(function(){						// 在当前抛物线轨迹下，获取炮弹下一次单位时间内x,y轴需要偏移的单位长度						var offset = parabolicMotion.moveNext()						crtBall.move(offset.x,offset.y)						refresh()												// 检查是否超出画布边界						completed = (crtBall.x>=opts.width||crtBall.y>=opts.height)						if(completed){							clearInterval(timer)							if(typeof onCompleted==‘function‘){								onCompleted(crtBall.x,crtBall.y)							}									}										},100)									}				return {					init : function(options){						opts = $.extend(options,{							canvas : null,//画布							width : 1000,//画布长							height : 300,//画布高							actionPoint : {x:150,y:200}/*作用力点坐标*/						})						ctx = opts.canvas.getContext(‘2d‘)						drawSling()						// 添加拉弹弓事件						initEvents()						return this					},					loadBall : function(ball){						var point = opts.actionPoint						crtBall = ball.init({ctx:ctx,x:point.x,y:point.y})													.draw()							return this					}				}			}

			// app						window.onload = function(){								var canvas = document.getElementById(‘canvas1‘)				var ball = new Ball(10)				var slingshot = new Slingshot().init({canvas:canvas})							// 装载一个炮弹				slingshot.loadBall(ball)			}