アイテムをランダムに配置する

 　今回はアイテムをランダムで配置するプログラムを作成します。

～今回の内容～


　バナナと階段が表示されています。更新ボタンを押します。


　リンゴと階段が表示されています。更新ボタンを押します。


　バナナと階段が表示されています。更新ボタンを押すたびにアイテムがランダムに表示されていることがわかると思います。

～プログラムの説明～

　今回のプログラムは、前回作成したランダムで表示されるマップの中に、さらにランダムでアイテムを出現させるものになります。
　下が今回の主なプログラムになります。


　前回作成したmapselect関数の中をいじりました。
　180～201行目の内容は、簡単に言ってしまうと配列map内の要素の値を変更するものになります。
　181~182行目の2重for文では配列map内の値を一つずつ参照するのに使います。
　183行目では「参照した配列の要素の値が1の時かつflag1がfalseの時」を条件としています。この場合、階段がマップ上に存在しないときとなります。
　184行目では0～1000未満の乱数を作成しています。
　185行目では乱数の値が0だった場合の処理を記述しています。その時、参照した配列の要素の値を3に変え、flag1をtrueとします。3は、本ゲームにおいて階段を意味する値です。そして、flag1をtrueとすることで、作成したマップ内に階段が存在することをゲームが認識します。
　186行目では乱数で生成した値が0じゃないときに処理を抜けることを意味しています。
　190~195行目では上述したのと同じような内容となっております。
　190行目でマップ上に階段が生成された際にこちらの条件式が真となるため、マップ上に階段が生成された時点で処理の内容がこちらに移行します。
　191~193行目では乱数で生成された値が0、1、2の際にマップ上に様々なオブジェクトを配置するプログラムとなります。
　199~201行目では、マップ上に階段が生成されなかった場合にもう一度mapselect関数を実行する処理となります。

おわり

　アイテムをランダムで生成するというのは、当初想定していた以上に手間取りました。ですが、今回の記事で完成させることができてよかったです。でも、実はこのプログラムの内容では、ゲームに多大なる欠陥が発生することがわかってしまいました。また別の方法を考えないといけませんね。頑張ったのに。。。
　次回の記事はそんな欠陥を改良するものになります。

コメント

コメントを投稿

このブログの人気の投稿

自己紹介と作成するゲームの説明

初めまして、ひらひさです。 　 趣味はギターとツーリングで、休日はほとんど趣味に費やすか家でダラダラしてます。 プログラミングに興味を持ったきっかけは、小中高とゲームをたくさんやってきた中で、今やっているゲームがどのようにして作られていったのかに興味を持ったからです。 やってきたゲームはポケモンシリーズにモンハンシリーズ、また当時流行っていたゲーム（妖怪ウォッチとか）です。 大学2年生になってからプログラミングに触れました。それまでも情報系の授業でJavaとかPython、CSSとかの名前は知っていたのですが、独学だと重い腰が上がらなかったのでゼミでプログラミングを学ぶことにしました。 ゲームの説明 　今回作るゲームは、ジャンルでいえばローグライクです。 ローグライクとは、ダンジョンに入るたびにマップ、アイテム、敵の数や位置がランダムに決定されるダンジョンをクリアまで導くゲームです。既存のゲームで例えるなら、トルネコの大冒険、風来のシレン、ポケモン不思議のダンジョンが挙げられます。 　少し難しいかもしれませんが、頑張って作っていきたいと思います。 今回は一つのダンジョンを深く深く潜っていくゲームにしたいと考えています。深くなるたびに、敵が強くなり、アイテムが変わり、お邪魔要素を追加したりと、難易度を上げていきたいと考えています。BGMをつけるのもいいかもしれませんね。  とか言っていますが正直どこまでやれるか不安ではあります。理想の形に近づけるように隙間時間を利用して少しづつ更新していきたいです。 参考文献 田中賢一郎『ゲームで学ぶ JavaScript 入門』インプレス、2015 年 田中賢一郎『ゲームを作りながら楽しく学べる HTML5+CSS+JavaScript』インプレス，2017 年 ＠Tatamo . ”もう一度理解する、JavaScriptの配列とコピー” . Qiita .          2019-12-24 .  https://qiita.com/Tatamo/items/444969a7ff2fbba30479 ,         （2024-07-02参照) akkie.i .  ...
続きを読む

ランダムにモンスターを出現させる

イメージ
 おひさしぶりです。結構更新が開いてしまいました。すみません でも、更新しない間に少しずつモンスターを発生させるプログラムを作成していました。 今回はモンスターを発生させるプログラムの他、少し改良した部分の解説を行います。 ～今回の内容～ 　初期画面です。犬がいます。階段まで移動します。 　階段の近くまで移動しました。この時、下の犬が移動していることがわかると思います。 　階段を上り、次のマップに移動しました。黒い玉ねぎがいますね。階段の近くまで移動します。 　階段の近くまで移動しました。この時、黒い玉ねぎも同時に移動しています。 ～プログラムの説明～ まず、マップにランダムにアイテムを配置するswitch文に、敵キャラを配置する際のプログラムを追加しました。ここでは276～279行目にあたります。 276行目では敵キャラ「オニオン」をマップ上に表示させるプログラムを書いています。 276行目でグローバル変数Enemy1にモンスターオブジェクトのインスタンスを格納しています。この変数Enemy1がオニオンインスタンスになります。引数x, yはマップを読み込む際にスライムが読み込まれたタイミングでのx, y の値となります。 　例）x座標が3, y座標が5のタイミングでスライムが読み込まれた際にスライムのx, y座標もx=3,y=5となり、マップに表示されます。 　また、flag関数を用いることによって、モンスターが出現しているかどうかの判定を行い、モンスターが出現しなかった場合でもプログラムが正常に動作するようにしています。 次に、モンスターの移動をスムーズにするためのプログラムを作成しました。 391行目以降では、マップ上の値が「1」（何も置いていない床）であるときの移動に関するプログラムを書いています。 393行目のif文では敵が左側を向いているかつ左側に壁がある場合のプログラムです。 　このプログラムは敵が永遠に壁側に進もうとして画面上で停止してるように見えてしまうことを防ぐために作りました。 394～397行目では左側（壁側）以外にランダムに進むようにプログラムを作成しました。 同じように上、下、右方向に壁がある場合にスムーズに移動させるようにプログラムを作成しました。 435行目以降はマップ上の値が「2」（通路）であるときの移動に関するプログラムを...
続きを読む

マップをランダムで生成する

イメージ
 今回はマップをランダムで生成するプログラムを作成します。 ～説明～ 　更新ボタンを押します。 　別のマップが表示されます。また更新ボタンを押します。 　またまた別のマップが表示されます。 ～プログラムの説明～ 　今回のプログラムは、既にあるマップデータからランダムで一つのマップを選択するようなプログラムになっています。本当は完全にランダムで画面上に生成したいとは思うのですが、現在の私の知恵と技術では無理がありました。厳しいって。 173 function mapselect() { 174 stage = Math.floor(Math.random() * map.length); 175 px = Math.floor(Math.random()*map[stage].length); 176 py = Math.floor(Math.random()*map[stage].length); 177 if (map[stage][py][px] == 0 || map[stage][py][px] == 2) { 178 mapselect(); 179 } 180 else { 181 return; 182 } 　上記が、今回作成した主なプログラムになります。 まず、ゲームが始まるとinit関数が発動します。init関数の中身は以下になります。 185 function init() { 186 cv = document.getElementById("field"); 187 gc = cv.getContext("2d"); 188 window.addEventListener("keydown", fieldkeydown); 189 mapselect(); 190 fieldpaint(); 191 } 　189行目に mapselect(); があります。これによって、init関数が発動した際に、関数mapselectを発動するようにしています。 では、mapselect関数の中を見ていきます。 　まず、174行目で6つのマップデータの中からランダム...
続きを読む