クォータービュープログラミング講座
クォータービューとは
トップビュー
真上からフィールドを見下ろした視点
バードビュー
正面斜め上（角度は任意）からフィールドを見下ろした視点
クォータービュー
斜め45度（任意）、斜め上（角度は任意）からフィールドを見下ろした視点
クォータービューを使うメリット、デメリット
（建物などの）見える面が増える。
上面、正面、左右いずれかの側面を同時に描画できるため、見栄えのいい画面を作りやすい
垂直方向の位置情報も表現できる
真上からのビューと比較した場合、地面にキャラクターの影を配置するなどの工夫をすればキャラクター
やオブジェクトの垂直方向の位置関係を表現することができる。
側面が２面表示出来るためバードビューと比較しても垂直方向の情報量は増える。
死角が増える。
下面、後、描画していない側の側面は死角になる。
RPGなどでキャラクターを操作する場合、建物の裏側に回りこむと表示できなくなる。
プレイヤー以外のキャラクターも同様で、アクションRPGなどでは死角に入ると敵が見えなくなるため
ゲームとしては遊びづらくなる
正面側のオブジェクトを省略するなどしてなるべく死角を減らすような工夫が必要になる。
トップビュー、バードビューと比較すると作成難易度が上がる
作成にあたっての注意点
トップビュー、バードビューと比較すると作成難易度が上がる
マップチップが菱形になるため座標の管理が困難になる
チップ同士のつなぎ目がずれやすくなるほか、画面端がギザギザになるため無駄な描画が発生する
重ね順の問題が発生する
チップが立体物の場合後ろ側のチップの上に上書きすることになる。
→描画順序の問題が発生する。後ろの物体から描画しないと表示がおかしくなる。
二次元配列マップデータを使う場合、配列の方向とマップ表示の方向は必ずしも一致しなくなる。
トップビューなどの場合は二次元配列のXY方向と画面上のXY方向は一致している。
クォータービューの場合はXY方向が画面上で斜めに表示されるか、あるいは配列と座標系を
揃えるかの判断が必要になる。
二次元配列データを３枚用意する
１．地面オブジェクト用
地面オブジェクトは通常菱形のものを使用しますが、今回はマップに高さを設定しているため、
高低差がある場合に側面が見えるように立方体のオブジェクトを作成し、その上面を地表として
表示するようにします。
２．地面オブジェクトの高さデータ
地面の高さは別マップとして作成します。マップを分けることで同じオブジェクトでも個別に高さを
設定することができます。
３．地表オブジェクト（地面の上に配置される）用
地面の上に配置するオブジェクトを別マップで作成します。
仮想マップを作成する際にX座標、Y座標に補正値を入れることで、通常のサイズよりも大きい（小さい）
オブジェクトも配置できるようになります。
描画前に仮想マップデータを作る
描画処理を行う前に、二次元マップデータを一度読み込んで、読み込んだデータに対して補足情報を
追加します。
クォータービューに限らず複雑なビューを作るときは先に仮想マップを作成したほうがデータを効率よく
管理できます。
補足情報は主に描画時の座標補正（X座標、Y座標）、障害物判定などがあります。
今回はカメラの向きが8方向あるため、カメラの方向ごとに描画する画像チップを設定し、また
描画座標の補正（すべての方向で共用）を設定しています。
※今回はX座標の補正は実際には使われていません。Y座標のみ適用されています。
カメラを８方向に回転させる
カメラ方向を8方向に設定し、仮想マップ作成時にその検出方向を制御します。
今回は斜め方向をクォータービュー、正面方向をバードビューで作成しています。バードビューの状態の
ときにマップは（データ配列に対し）水平垂直に検出を行い、クォータービューの時には斜め方向に検出を
行います。
キー入力の受付などを実装する
このあたりの説明は割愛させていただきます。
見本プログラムにはメニューウィンドウの機能なども実装されていますが、ソースコードなどを確認されたうえで
ご利用ください。
サンプルプログラム（javascript版）
ブラウザなどでご参照ください。
素材などのご利用は個人の範囲内でお願いします。
同梱されているデータを使用したコンテンツをインターネットに公開したり、商用利用したいなどの場合は別途ご相談ください。
動作環境:windows 32/64bit
開発言語:javascript
-- DOWNLOAD (windows 32 / javascript) --
■ トップページに戻る / back to top page ■