我应该用canvas元素替换所有img元素吗？

Question

我是html5的canvas元素的新手。我特别想知道何时应该在canvas元素中放置一个现有的img元素。

这有什么好处或适当的用途？

我一直在阅读Dive into HTML 5并且在他们关于画布主题的总结性陈述中并没有得到我想要的东西：

  

简单的答案是，出于同样的原因，您可能想要绘制文本   在画布上。画布坐标图包括文本，行和   形状;画布上的文字只是大型作品的一部分。一个   更复杂的图表可以轻松使用drawImage（）来包含图标，   精灵，或其他图形。

Answer 1

img在哪里完成工作，请使用它。 canvas确实是一个非常强大的工具，但是：

1. 虽然今天大部分浏览器都支持它，但img仍得到更广泛的支持。
2. 如果您需要为禁用JavaScript的用户提供服务，则无法使用canvas; canvas需要运行JavaScript，而img则不需要。

那就是说，如果你需要只有canvas可以做的事情，请随意。例如：

• 您是否需要加载图像然后让用户变形或在其上绘图？ canvas会在那里做得很好。
• 您是否需要动态绘制一些图表和图形？ canvas也适用于那里。

如果您不需要canvas的更高级功能，只需要显示图像，img是最明显和最兼容的选择。

Answer 2

图像标记最适合用于静态图像。

Canvas引用HTML5工作组，“依赖于分辨率的位图画布，可用于动态渲染图形，游戏图形或其他可视图像。”

因此，您可以将图像拍到画布上，但这可能会增加您正在创建的其他工作，如图表或游戏图形。

更新后更新

因此，如果您想创建一个真实复杂的图表来实时跟踪库存性能，您可以使用画布绘制图形的各个条形图，然后使用drawImage（）将公司徽标放在画布表示哪个栏属于哪个栏。