L@ f,IGX K" Y^ҚTy"a"* z0uN(x`X@, Fd/Ę<0: 3fa=65L\2MM8CLtd=xū Y קbid]ddates2024-09-25T23:55:00etitlex$JavaScriptでAR巨大迷路づくりdtagsg#js #vrcurlxhttps://fukuno.jig.jp/4445dbodyy
JavaScriptで作った迷路 Maze.js を使って、懐かしのAR巨大迷路を作りました。
セミナールームで迷路にチャレンジした時の様子。
「AR Maze」 src on GitHub or ss.sabae.cc
5x5の手頃な大きさの巨大迷路を楽しめます。PCではカーソルキーの上下左右で歩けます。
ハッシュでサイズ変更に対応。10x10、20x20など、お好きなの巨大迷路をどうぞ！
迷路を3D化するコードはこちら。
const createMaze = () => {
const maze = new Maze(mazew, mazeh);
const grp = new THREE.Group();
const wall = (x, y, rot) => {
const w = createWall();
if (rot) w.rotation.y = Math.PI / 2;
w.position.x = x;
w.position.z = y;
grp.add(w);
};
const w2 = wallw / 2;
for (const i of maze.grid) {
const x = i.x * wallw;
const y = i.y * wallw;
if (i.walls.top) wall(x, y - w2, false);
if (i.walls.bottom) wall(x, y + w2, false);
if (i.walls.left) wall(x - w2, y, true);
if (i.walls.right) wall(x + w2, y, true);
}
return grp;
};
Maze.js で生成し、4面の壁の有無に合わせて3Dの壁を生成して返しています。
links
- 2012-10-08 迷路作成
- 2018-08-15 426byteの迷路ゲーム、ローカル対戦＆IchigoSodaでネット対戦への改造法
- 2019-12-09 遊んで学ぶアルゴリズム 迷路棒倒し法をIchigoJamでつくろう - クリスマスイベント by コプリ / PCN大阪
- 2024-09-24 JavaScriptで迷路づくり
cimgxKhttps://img.sabae.cc/data/20240926/20d4ea01-5f77-43da-9ea1-9730de8e9836.jpg