JS
前回までは敵が攻撃してこなかったので、今回は敵が攻撃するように変更した。まずは ./object/EnemyBullet1.js。コンストラクタで１フレームあたりに移動する距離を受け取り、doActionで移動する var EnemyBullet1 = function(dx, dy){ this.position = new …
前回まではプログラムに直接敵の登場場所などを書いていたが今回からJSONに移してみた。まずはそのJSONから。ファイル名はEventList.js、フォルダはeventという名前にした。イベントエントリの配列となっている。イベントエントリは敵の名前と登場フレーム数…
JavaScriptが少しずつわかって気になってる今日このごろ。頑張ってCanvasでシューティングゲーム作ります、はい。それでまずHTMLを修正。キーイベントで方向キー(?)も使えるようにしてみた。keyydownとkeyupのswitch文を若干変更。移動につかうキーを増やし…
今回は簡単な修正を行う。それは、前回までのプログラムだとFirefox9でキーイベントが発生しなくなっていたので、これを修正。body要素のonkeydownとonkeyupを取っ払いHTMLに書いたgame関数を以下のようにする。document.onkeydownとdocument.onkeyupの行を…
前回は敵を作ったので実際に登場させてみることにした。まずはHTMLで前回追加したJavaScriptを読み込んでおく <script type="text/javascript" src="./object/GameObject.js"></script> <script type="text/javascript" src="./object/Enemy1.js"></script> そして、GameView.js。init()で敵の追加とdraw()で敵の行動と描画を行うようにした var GameView = function(context, width, height){ var i…
前回作ったPlayerとPlayerBullet1は共通する処理があったので、今回は継承(?)を使って共通する処理をまとめてみた。ついでにEnemy1も作成した。ただ、まだ敵はでてこない。まずは共通する処理をまとめたGameObject.js var GameObject = function(){ this.mov…
HTML5のCanvas使って簡単なシューティングゲームを作ろうと思っている。JavaScript初心者だがなんとかする。それで現在はプレイヤー機を操作できるところまでいった。まずはHTML、onloadでgameを呼び出し初期化と16msec毎に描画を行うようにしている。keydow…
Canvasを使って簡単なゲームを作ろうと思っている。凄い物は作れないのでしょぼいゲームを作る
http://www.geocities.jp/oirahakobito2/より『swatっぽいの+イングラムM11っぽいの』をダウンロードしてきて置いてみた。自分で敵キャラを作れるようになるのはいつのことか…
弾数とリロードを実装した。また、弾の連射速度の限界を設定。前は１フレームごとに発射できたからね。そして、左上にあるのが弾数。左が現在装填されている弾の数。右が現在持ってる予備の弾の数。わりと新しいChromeかWebGLを有効化したFirefoxで見てね！ …
今まで移動するときは視点を直線的に動かしていたけど、今回からちょっとブレを入れてみた。移動中に視点と銃が若干ブレるようにした。Chromeの新しい奴かWebGLを有効化したFirefoxでデモ見れますhttp://myfpstest.appspot.com/ 操作方法 W 前に移動 S 後ろ…
http://sakura.hippy.jp/meta/で公開されている銃を使わせてもらいました。モデルが変わると気分も変わる。やる気アップだ！
今まで段差のある場所の移動で、上るときや下るときにいきなり座標を上下させていたが、徐々に座標を変化するようにした。16msで上下してたのを90msかけて上下するようにした。あと、だんだんJavaScriptが分かってきた気がする。気がするだけだけど。WebGLに…
段差の乗り越えの実装と、視点の向きを上下方向に変更した。ただ、上に向きすぎるとなぜかバグってしまうので、上下方向はあまり動かないようになっている。Chromeのわりと新しいバージョンか、WebGLを有効化したFirefoxで見れるはず http://myfpstest.appsp…
今までは平面の上の移動のみだったけど、今度は段差をつけてみた。まだ、上ったり下りたりできないので、次は段差の移動を実装したい
弾を撃てるようにしたので、アップロードした。本物の銃じゃないので反動とか無い設定だし、リロード無しで無限に弾を撃てる。途中で弾が消える現象あり。Chromeの新しいバージョンなら動くでしょう。多分。いいのかそれで 操作方法 W 前に移動 S 後ろに移動…
かなり適当なモデルを作り、敵として配備。Three.jsでモデルのアニメーションってどうやるんだろう？
DirectionalLightを使ってみたら、銃に質感がでてきた。また。何か立体っぽくなった気がする
前日作ったFPSもどきを公開する。地面はあるものの、境界などのチェックは行っていないため、地面以外の部分も移動可能。ChromeやFirefoxの比較的新しいバージョンなら動くはず。ただ、Firefoxの場合、デフォルトでWebGLが無効になってる気がするので、何か…
Three.jsでちょっとFPSっぽく表示してみた。移動できるようになったので、壁とか天井とかも作っていきたい
Three.jsでMQOデータを表示するまでを参考にBlenderとプラグインを入れて、メタセコイアで作ったモデルを表示してみた。なんか色々パーツが取れてしまっているが表示はできている。あとは、パーツが全て表示されてない原因を探りたい
斜めから見た状態にするためタイルをアフィン変換で移動させてるけど、これでいいのだろうか？カメラを動かせばいいような気もしたけど… <html> <head> <meta charset="utf-8"> <title>CubeTest</title> <script src="./Three.js"></script> <script> addEventListener("load", function(){ var camera, scene, renderer; camera = new THREE.Camera(75, </meta></head></html>…
JavaScriptで3Dを描画するThree.jsを試してみた。WebGLも使えるけどCanvasにも描画できる優れもの。でもCanvasだと遅そうだな、俺のイメージで。それで他の人が公開しているソースコードを元にプログラムを作ってみたけど動かなかった。Three.Cubeなんてコン…
