简单物理模拟

老Man

浏览: 238078 次
性别:
来自: 常州

最近访客更多访客>>

goahead2010

zlc521lj

qj624904774

一夕剑

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

javascript

晚上，看完神探夏洛克之后写的。还需要再多研究研究，感觉运行的不是很流畅。毕竟光有物理的概念还是不够的。还需要很多游戏编程与JavaScript方面的知识。

还有我终于知道C++有什么用了。

1.以下代码取出了能量不守恒的bug。之前的bug出现在碰撞处理中。

2.计算方法：精度最差的单步欧拉法。

<html>
<head>
<script type="text/javascript">
	//主方法
	window.onload=function(){
		var cxt=$("canvas").getContext("2d");
		
		//初始化时间控制器
		var timer=new Timer();
		
		//初始化世界控制器
		var world=new World(1000,700,100,70,25);
		
		//创建一个粒子
		var p1=new Particle(1,10,60,20,0);
		var p2=new Particle(1,50,20,-6,5);
		var p3=new Particle(1,50,30,4,-7);
		var p4=new Particle(1,50,40,-8,-15);
		
		//在世界中加入粒子
		world.addParticle(p1);
		//world.addParticle(p2);
		//world.addParticle(p3);
		//world.addParticle(p4);
		
		//事件绑定
		$("startbutton").onclick=function(){
			var cdt=world.cdt;
			timer.start(step,cdt);
		}
		$("endbutton").onclick=function(){
			timer.end();
		}
		
		function step(){
			world.run();
			world.view(cxt);		
		}
		
	}
	
	//世界类
	function World(canvas_width,canvas_height,world_width,world_height,fps){
		var AllP=new Array();  //粒子容器
		var cw=canvas_width;
		var ch=canvas_height;
		var ww=world_width;
		var wh=world_height;
		var cdt=Math.round(1000/fps);//绘图间隔时间；    单位：毫秒
		var dt=cdt/1000;    //运动时间
		var widthRate=cw/ww;
		var heightRate=ch/wh;
		var g=10;	//重力加速度
		this.addParticle=function(p){
			AllP.push(p);
		}

		this.run=function(){
			for(var i=0;i<AllP.length;i++){
				
				if(AllP[i].r.x<=0 || AllP[i].r.x>=ww){//撞击竖直壁
					AllP[i].r.x-=AllP[i].v.x*dt;//x速度反向。y方向继续
					AllP[i].v.x=-AllP[i].v.x;
					AllP[i].r.y+=AllP[i].v.y*dt;
					continue;
				}
				if( AllP[i].r.y<=0 ||AllP[i].r.y>=wh){//撞击水平壁
					AllP[i].r.y-=AllP[i].v.y*dt;//y速度反向。x方向继续
					AllP[i].v.y=-AllP[i].v.y;
					AllP[i].r.x+=AllP[i].v.x*dt;
					continue;
				}
				AllP[i].v.y+=g*dt;
				AllP[i].r.x+=AllP[i].v.x*dt;
				AllP[i].r.y+=AllP[i].v.y*dt;
			}
		}
		
		this.view=function(context){
			context.clearRect(0,0,cw,ch);
			for(var i=0;i<AllP.length;i++){
				var x=widthRate*AllP[i].r.x;
				var y=heightRate*AllP[i].r.y;
				context.beginPath();
				context.arc(x,y,2,0,Math.PI*2,true);
				context.fill();
			}
		}
		
	}
	
	
	//粒子类
	function Particle(m,x,y,vx,vy){
			this.m=m;
			this.r=new Vector2D(x,y);
			this.v=new Vector2D(vx,vy);
	}
	
	
	//定时器类
	function Timer(){
		var timer=null;
		this.start=function(fn,time){
			if(timer==null){
				timer=setInterval(fn,time);
			}
		}
		this.end=function(){
			clearInterval(timer);
		}
	}
	
	//2维向量类
	function Vector2D(x,y){
		this.x=x;
		this.y=y;
	}
	
	
	//================函数======================
	
	//id选择器
	function $(id){
		return document.getElementById(id);
	}
	
	//[a,b)之间的随机数
	function random(a,b){
		return Math.random()*(b-a)+a;
	}
	
</script>
</head>
<body>
<canvas id="canvas" width="1000" height="700" style="border:2px solid red"></canvas><br>
<input type="text" id="intext" value="1"><br>
<input type="button" id="startbutton" value="开始">
<input type="button" id="endbutton" value="结束">
<input type="text" id="t">
</body>
</html>

分享到：

2维函数绘图 html5版 | 工作中的一些读音

2012-09-11 00:46
浏览 954
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

简单物理模拟

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

简单物理模拟

评论

发表评论

相关推荐

jQuery操作iframe

js获取选中内容

利用jquery批量下载verycd资源

jquery基础

JQuery Ajax

ajax与缓存

JavaScript 打印机 打印页面

My计算库（JS版本）

这是什么？

JavaScript：键盘事件

2维函数绘图 html5版

javascript计算24点

正则表达式验证器

Ajax基础

<a>的href中放js代码 与 <img> usemap属性

google眼睛的实现

javascript获取css盒子模型的一些值

灵动的JavaScript

小练习javascript

最近访客更多访客>>

JavaScript 打印机打印页面

<a>的href中放js代码与 <img> usemap属性