モンスターをプレイヤーに近づけるようにする
今回はモンスターがプレイヤーに近づいていくようにするプログラムを作成しました。 ～今回の内容～ 左側の蟻にご注目ください。この画面から下方向へボタンを押します。 プレイヤーは下に移動し、蟻は上に移動したのがわかります。またこの状態から下にプレイヤーを動かします。 プレイヤーが下に移動しました。そして蟻は右に移動していることがわかります。この状態から今度は右に何マスか移動させましょう。 プレイヤーが右に移動しています。ついでに蟻もプレイヤーに追随するように移動しているのがわかりますでしょうか。この状態からまた右に移動してみます。 今度はありだけではなく左下にいる犬もプレイヤーに近づいています。 今回はこのような動作をどのようにプログラムしたのか解説します。 ～プログラムの説明～ モンスターとプレイヤーの距離を把握する 今回の動作を実現するにあたり、モンスターがプレイヤーの座標を把握する必要があります。そのため、モンスターオブジェクトに新しくプロパティとメソッドを追加しています。下が追加したプログラムになります。 583行目にthis.dis、584行目にthis.xdis、585行目にthis.ydisを追加しました。 607~612行目にかけてthis.discalcメソッドを追加しています。 608行目ではthis.xdisにモンスターのx座標とプレイヤーのx座標の差を代入しています。 609行目ではthis.ydisにモンスターのy座標とプレイヤーのy座標の差を代入しています。 610行目でモンスターとプレイヤーがどのくらい離れているかを計算しています。この計算には2点間の距離を求める公式を使っています。 これらの処理を画像を使って解説します。 プレイヤーとモンスターが上記の位置関係にあるとします。この位置関係を三角形で表すと画像のように、底辺がxdis、高さがydis、斜辺がdisといったように表せます。2点間の距離を求める公式は √(x2-x1)^2＋(y2-y2)^2となります。この式に上記の情報を当てはめることでモンスターとプレイヤーの距離を導くことができます。 まず、608行目のthis.xdis = (this.px - playerpx)はxdis = (3 - 1)がとなります。答えはxdis = 2になります。 60...