プログラム

解　説

考　察

//一定時間ごとに実行させる関数の本体
①　if(0<x&&x<canvas.width && 0<y&&y<canvas.height){
②　x=x+vx0*dt;
③　var v1=vy,v2=vy-g*dt;
④　y=y+(v1+v2)/2.0*dt;
⑤　vy=v2;
⑥　t=t+dt;
⑦　}else{
⑧　x=x0,y=y0,vy=vy0,t=t0;
⑨　}
⑩　context.clearRect(0,0, canvas.width,canvas.height);
⑪　context.beginPath();
⑫　context.arc(x,canvas.height-y,20,0,2*Math.PI,false);
⑬　context.closePath();
⑭　context.fillstyle='rgb(255,0,0)';
⑮　context.fill();
⑯　}

①var canvas=document.getElementById('mycanvas');
②var context=canvas.getContext('2d');
③var timerID=setInterval('draw()',50);
④canvas.width=1000,canvas.height=500;

//変数の初期値設定
①　var t0=0.0,dt=0.1,g=9.8;
②　var v0=Number(prompt('初速度を入力してください',''));
③　var degrees=Number(prompt('角度°を入力してください',''));
④　var vx0=v0*Math.cos(degrees*Math.PI/180);
⑤　var vy0=v0*Math.sin(degrees*Math.PI/180);
⑥　var x0=canvas.width/4,y0=3*canvas.height/4;
⑦var x=x0,y=y0,vy=vy0,t=t0;

　　//一定時間ごとに実行させる関数の本体

①キャンパスの取得
②コンテキストの取得
③タイマの設定（50ミリ秒ごとに繰り返し実行され、画面
描画が更新される。
④キャンバスの幅と高さ

　//変数の初期値設定

関数など	機能
Number	数値に変換
prompt	入力
Math.sin	sinθ
Math.cos	ｃｏｓθ
Ｍａｔｈ．ＰＩ	π（円周率）

　物体の位置（ｘ、ｙ）が①行目で設定したキャンバスの範囲内
（0＜ｘ＜100かつ0＜ｙ＜500）ならば、②～⑤行目の部分で
物体の座標と速度を計算して、⑩～⑮○行目の部分で
ャンバス座標（Ｘ，Ｙ）が中心になるような円を描画している。
　また、⑦行目で範囲以外になったときに⑧行目で初期位置
に戻している。
　②行目の右辺の「ｘ」はｘ（ｔ）を左辺の「ｘ」はｘ（ｔ＋⊿ｔ）
をそれぞれ表しており、ｘ（ｔ+⊿ｔ）＝ｘ（ｔ）+ｖｘ0⊿ｔのｘ方向の位置を
計算している。