为什么要使用HTML 5 Canvas标签？

Question

原谅我的无知，但我是HTML 5竞技场的新手，从未使用过Javascript的图形。

我正在做一些阅读并遇到Canvas标签，并且源声明canvas标签充当图形容器，用于通过使用Javascript在网页上呈现图形。

我的问题是，为什么我需要使用Canvas作为占位符来渲染图形，而不是使用其他可以用作图形占位符的任意标记？

Answer 1

<canvas>标签与<img>标签完全相同，区别在于您可以使用javascript代码自行绘制，而不是从网络加载图像。 您可以绘制线条，圆形，填充多边形，渐变和矩阵变换图片。 您还可以在循环中重绘画布内容以制作动画。

要了解使用普通画布2d（没有webgl，只是标准的2d渲染）可以做些什么，请查看这个小型演示，或者如果您的浏览器太旧并且不支持画布，请查看此视频 。

它是纯粹的javascript，没有从网络加载，一切都在浏览器中计算，包括纹理和用于envmapping部分的光线追踪图像。 全部在一个4Kb html文件中。

你真的认为你可以使用常规的<div>来做同样的事吗？

编辑：

对于具有可读源的更简单的演示，您可以查看这个旋转的二十面体 。

Answer 2

Canvas 适用于图形操作，而div不是。 从语义上讲，你应该使用Canvas 。

Answer 3

你不能在任意元素上绘制。

Answer 4

Canvas允许您以可接受的速度操纵像素。 您可以绘制各种形状，为像素设置颜色等。使用div，您只能渲染标准HTML元素。

Answer 5

DIV是其他标签的容器。 CANVAS是像素的容器。

虽然（可能）可以在普通DIV内完成您想要绘制的所有事情，但是使用CANVAS ，浏览器在语义上知道该区域将包含图形并且可以相应地使用该信息。

浏览器本身支持CANVAS的各种绘图程序，而你必须完全用JS for DIV自己烹饪。

有关HTML5画布信息的非常好的资源是http://diveintohtml5.ep.io/canvas.html

Answer 6

为何使用帆布：
1- canvas可以安全使用并与多平台兼容。
2-它在动画中有很多准备好的功能。
3-你可以玩速度，像素，颜色。
4-你可以将画布的结果保存为图像。 5-你可以用帆布实现专业游戏。 检查一下

只是它像闪存一样，但没有插件。

usefaul库使用：
- 画架js ：flash就像库
- 处理js ：打开souece动画库

Answer 7

绘图使用

<canvas> 

在使用此网页进入网页时会立即加载，其中a

<img>  

需要更长的时间。