为什么?
实现后，令我高兴地是，我已经阅读的漂亮的<canvas>元素不仅是即将支持Firefox，而且已经支持当前版本的Safari，我要尝试一个小实验。
在MDC中，我发现canvas概述和教程是非常完美的，但是还没有人写关于动画的东，于是我想尝试一个我之前做过的基本射线的动画，看看能从我们期待的JavaScript控制像素缓冲区中得到什么样的现象。
怎么做?
基本思想是对任意延迟的帧速率使用setInterval。每一个间隔后都会调用一个更新函数来重绘画布显示当前视图。我知道我可以从一个简单的例子开始，但我相信canvas教程会有，我想看看我能否做到。
所以，每次更新，涉嫌发射器会检测你最近是否按下任何按键，如果你是闲置状态，会不通过投射来保存计算结果。如果你有按键按下，画布会清空，绘制背景和前景，更新相机的位置或方向，光线被抛弃。当光线与墙壁相交时，他们呈现出一种垂直的帆布条，其颜色和墙壁颜色相匹配，根据离墙壁的距离混合不同深度的颜色。帆布条的高度也会根据相机到墙壁的距离进行调节，并且被绘制在水平线居中位置。
我最后的那段代码是从一本比较老的Andre所著的游戏编程中经过反复合并以及一个java raycaster网站上得到的，并且对我有用的地方都进行了重命名，这是让我做的更好应该做的。
结果
Safari2.0.1中的画布执行的非常好。使用块效应因子来渲染8像素宽的条纹，我可以在我的苹果mini中以24fps的帧率运行320*240的窗口。Firefox1.5 Beta1 更快；同样帧率和窗口大小的情况下，我可以运行4像素宽的。不是ID软件系列的一个新成员，它是一个完美的解释型环境，并且我不需要担心内存分配、视频模式或者编码在汇编或者其他内部的例程。代码会通过使用预计算的数组查找来尝试高效的运行，但是我没有优化大师，所以这可能会写的更快。
此外，它在尝试任何类型的游戏引擎方面留下了很多希望-没有条纹的墙、没有精灵、没有门，甚至没有任何传送器到达另一层。但是我相信所有那些东西可以给足够时间去添加。canvas API支持图像的像素复制，所以纹理看起来可行。我会留下另一篇文章，可能是从别人那找来的。
光线发射
这里的人已经动手复制我的文件，所以，为了满足你的黑客享受，我已经张贴了个人文件内容作为代码列表（见下文）。
所以，打开Safari.13机票总金额Firefox1.5或者其他支持canvas的浏览器来体验吧
input.js | Level.js | Player.js | RayCaster.html | RayCaster.js | trace.css | trace.js