项目简介:
项目分为两个部分:
第一部分是一个迷宫Maze, 首先生成矩形cell数组,每个cell有4个side,然后一步一步地remove side(不包括迷宫边缘的side),直到全部的cell 都连通(connected)。然后在迷宫的左边缘创建一个入口,在右边缘创建一个出口。
整体网页需要接收2个参数:N和M, 迷宫的大小为N*M。
第二部分是交互操作Guide。在迷宫入口设置一个老鼠图片,然后可以通过左右键调整老鼠的朝向,方向键上来前进一步。
收获
webgl 三个js库
webgl-utils.js
webgl-debug.js
cuon-utils.js
图片加载
var img = new Image();
img.src = ‘./rat.png’;
img.onload = function(){
img_loaded = true;
}
图片应该最先加载。这样可以防止webgl在渲染的时候图片还没加载完而出现黑屏的问题。
监听键盘事件
保证事件代码只运行一次。否则会重复绑定多个事件,也就是按键一次会触发多次事件处理。
do