Jump3(斜めにJump)


初速度 角度

code

<canvas id="game" width="300" height="300"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("game");
var ctx = canvas.getContext("2d");

var p;
var c_w = canvas.width;
var c_h = canvas.height;

function init(vo,deg){
	p = new Player(vo,deg);	
}

init();

var tm;
tm = setInterval(main,10);

function main(){
	//画面のクリア
	ctx.clearRect(0,0,c_w,c_h);
	p.view();
}

function Player(vo,deg){
	var obj = this;
	obj.size = 10;
	obj.x = obj.size/2; //円中心のx座標
	obj.y = c_h-obj.size/2; //円中心のy座標
	obj.vo = vo ? vo : 30; //初速度
	obj.deg = deg ? deg : 45; //飛ぶ角度
	obj.g = 0.1; //重力加速度
	obj.h = 0.9; //跳ね返り係数
	
	//y向き速度を出す
	obj.vy = -obj.vo * Math.sin(obj.deg * (Math.PI / 180));
	//x向き速度を出す
	obj.vx = obj.vo * Math.cos(obj.deg * (Math.PI / 180));
	
	obj.view = function(){
		//ボールを現在のx,y座標に従って表示する
		ctx.beginPath()
		ctx.fillStyle = 'blue';
		ctx.arc(obj.x, obj.y, obj.size/2, 0, 360,false);
		ctx.fill();
		
		//次のxの位置
		obj.x = obj.x + obj.vx;
		//次のyの速度
		obj.vy = obj.vy + obj.g;
		//次のyの位置
		obj.y = obj.y + obj.vy
		
		//次のxが横の壁にぶつかる場合
		if(obj.x <= obj.size/2){
			obj.x = obj.size/2;
			obj.vx = -obj.vx * obj.h;
		}else if(obj.x >= c_w-obj.size/2){
			obj.x = c_w-obj.size/2
			obj.vx = -obj.vx * obj.h;
		}
		//次のyが上下の壁にぶつかる場合
		if(obj.y <= obj.size/2){
			obj.y = obj.size/2;
			obj.vy = -obj.vy * obj.h;
		}else if(obj.y >= c_h-obj.size/2){
			obj.vy = -obj.vy * obj.h;
			 if(obj.vy >= 0){
			 	obj.vy = 0;
				obj.g = 0;
				obj.vx = 0;
			 }
		}
	}
}

//サイト上で初速度、角度を入力して、Shotボタンを押した場合
$(function(){
    $('#shot').click(function(){shot();return false;});
});

function shot(){
	var vo = $("#vo").val();
	var deg = $("#deg").val();
	
	if(!(vo>=1 && vo<=100)){
		alert("初速度は1-100を入力してください");
		return;
	}
	if(!(deg>=10 && deg<=90)){
		alert("角度は10-90を入力してください");
		return;
	}
	init(vo,deg);
} 

</script>

<P>初速度 <input id="vo" type="text" size="3" value="30" /> 
角度<input id="deg" type="text" size="3" value="45" />
<input id="shot" type="button" value="Shot!" />
</P>