javascript 【JavaScript】 球と球の衝突反応 最も簡単な衝突反応 球と球が衝突した時の動き(衝突反応)をJavaScriptで実現してみる。ビリヤードの球の動きが典型例で、昔からあるおはじきやビー玉遊びも含まれるだろう。ビデオゲームではスマホアプリの「モンスターストライク」などが代表... 2023.01.28 javascriptゲームアルゴリズム
javascript 【JavaScript】ボールを壁で跳ね返させる ボール(といっても猫だが)をCanvas内で跳ね返らせる。矢印キーで操作し、壁に衝突すると反射する。 別ページで表示 まず、猫画像を表示するCatクラス。 /** * 猫画像を表示(cat.js) */ ex... 2022.12.27 javascriptゲームアルゴリズム
javascript 【JavaScript】マウスカーソルを追いかけるマウスストーカーを作る Canvas上の矢印がマウスカーソルを追いかけてくる。ただ追いかけるだけでなく、マウスカーソルの方向を向いて追ってくる。ベースは「【JavaScript】オブジェクトを回転させる」であり、そこに移動処理を加えている。 Arrowク... 2022.12.21 javascriptゲームアルゴリズム
javascript 【JavaScript】オブジェクトを円運動させる Canvas上に描画した画像を円運動させてみる。 まず、画像を表示するCatクラス(cat.js)を用意。猫のイラストを表示する単純なもの。 /** * cat.js * 猫画像を表示 */ export cl... 2022.12.18 javascriptゲームアルゴリズム
javascript 【JavaScript】オブジェクトを伸縮させる JavaScriptで画像を大きくしたり、小さくしたりする処理を作る。ゲームでボタンを押した時、押し広がるアニメーションなどに使える。 まず、ボタン画像を表示するクラスを用意。button.jsは画像を読み込んで表示する簡単な... 2022.12.17 javascriptゲームアルゴリズム
javascript 【JavaScript】requestAnimationFrameでゲームループを作る requestAnimationFrameとFPSの制御 ゲームプログラミングではゲームループ構造を作り、ループの中で画面の更新処理を実装する。更新処理を担当するゲームループ用関数を用意し、タイマー機能を使い一定間隔で実行し続ける。1秒間... 2022.10.05 javascriptゲームアルゴリズム