从描绘正五边形的过程中可以看到，利用 CANVAS 的接口绘图，虽然带来了很多的便利，但是同时也需要很多基础的数学知识（三角函数、一次函数）去完成数学建模，达到预期的绘图效果。最后文字的描述和球队描绘类似，不再赘述。

信息查看

CANVAS 也和其他的 DOM 元素一样可以监听各种事件，在 CANVAS 中用户点击的具体位置会产生两个不同的坐标，分别是在 CANVAS 中的坐标 (CX, CY) 和在整个 DOM 页面中的坐标 (DX, DY)。一般来说，前者主要是为了在 CANVAS 中继续绘图，比如将一个矩形移动到新的位置；后者则是为了显示提示信息，比如在 DOM 节点中有一个显示详细信息的 DIV，那么通过这个坐标值，就可以将 DIV 设定为 absolute，显示在合适的位置上。具体的公式如清单 6 所示：

清单 6. 事件坐标公式

CX = e.x; CY = e.y; DX = CX - e.target.offsetLeft + document.body.scrollTop; DY = CY - e.target.offsetTop + document.body.scrollLeft;

其中 e 是相应的触摸事件对象。可以看到影响整个 DOM 坐标的除了本身点击的位置，还有 CANVAS 相对于 DOM 的偏移量，以及整体 DOM 卷轴的位置。

结论和展望

在对实例进行了详细分析后，CANVAS 强大的绘图能力一定已经被读者所了解。在熟悉它提供的不同 API 基础上，开发者还需要对相应的数学知识有足够的了解才可以更好的绘制图像，创建自身应用需要的内容。

当然强大的 CANVAS 不但能实现绘图功能，而且为将来的网页开发带来了更多的可能，以下列出了七种：游戏，毫无疑问游戏在 HTML5 领域具有举足轻重的地位。HTML5 在基于 Web 的图像显示方面比 Flash 更加立体、更加精巧；广告，Flash 曾经辉煌的时代，智能手机还未曾出现。现在以及未来的智能机时代，HTML5 技术能够在广告上发挥巨大作用，用 CANVAS 实现动态的广告效果再合适不过；模拟器，无论从视觉效果还是核心功能方面来说，模拟器产品可以完全由 JavaScript 来实现；远程计算机控制，CANVAS 可以让开发者更好地实现基于 Web 的数据传输，构建一个完美的可视化控制界面；字体设计，对于字体的自定义渲染将完全可以基于 Web，使用 HTML5 技术进行实现；图形编辑器，图形编辑器将能够 100%基于 Web 实现；其他可嵌入网站的内容，类似图表、音频、视频，还有许多元素能够更好地与 Web 融合，并且不需要任何插件。这些内容都是将来的手机应用开发可以尝试的领域，通过认真的学习可以寻找到 CANVAS 更多更合理的应用方式和技巧。

参考资料

CANVAS的基础内容介绍（地址）

三角函数的介绍和公式（地址）

jQuery 的介绍和 Query Mobile的内容（地址）