HTML5 Canvas 基础知识与入门

引言

HTML 5 规范引进了很多新特性,其中最令人期待的 之一就是 canvas 元素。HTML 5 canvas 提供了通过 JavaScript 绘制图形的方法,此方法使用简单但功能强大。每一个 canvas 元素都有一个"上下文( context )" (想象成绘图板上的一页),在其中可以绘制任意图形。浏览器支持多个 canvas 上下文,并通过不同的 API 提供图形绘制功能。

W3C HTML5

既然,这个元素可以用来在 HTML 页面中通过 JavaScript 进行绘制图形、合成图像并且还可以做一些简单的动画,当然备受业界关注。目 前 HTML5 规范还在草稿阶段,正式发布也许要等到2010年,不过现在已经有不少浏览器已经支持了部分 HTML5 规范。目前支 持 canvas 元素的浏览器有 Firefox 3+、Safari 4、Chrome 2.0+ 等,因此,在运行本页中的例子时,请确保你使用的 是上述浏览器之一。

大部分的浏览器都支持 2D canvas 上下文——包括 Opera, Firefox, Konqueror 和 Safari。而且某些版本的 Opera 还支持 3D canvas ,firefox 也可以通过插件形式支持 3D canvas 。我们甚至可以在 IE 中使用<canvas> 标记,并在 IE 的 VML 支持的基础上用开源的 JavaScript 代码(由 Google 发起)来构建兼容性的画布。 参见:http://excanvas.sourceforge.net/

关于HTML5 Canvas 文章的搜集,以备后用。

基础知识

使用教程

HTML5 Canvas实验

HTML5 Canvas for Internet Explorer(让IE也支持Canvas

HTML5 测试how well does your browser support HTML5?

站点统计