HTML 5 中的画布是啥？

Posted 2023-03-05

【中文标题】HTML 5 中的画布是啥？

【英文标题】：What is canvas in HTML 5?HTML 5 中的画布是什么？

【发布时间】：2017-04-14 07:11:12

【问题描述】：

什么是 html 5 中的画布？作为开发人员，我有点新。 Canvas 是一个 HTML 区域，您可以在其上绘制图形。

""500"" id=""mycanvas"" solid="" style=""border:1px" 600""></canvas>

---

var c=document.getElementById("mycanvas");
var ctx=c.getContext("2d"); 

什么意思？

【问题讨论】：

@Nisse Engström 谁在做 -vote.... 管理员女士发现谁在投票 -vote 并停止该权限。我的名声因此而下降。真的很恶心

@Vj：我不知道。投票数据对你和我这样的普通用户根本不可用。据我所知，甚至连版主都不知道。

@NisseEngström 看到我有 8 个声望，但现在只有 6 个......而且我需要 20 个声望才能进入聊天室......我真的需要进入聊天室，因为我需要澄清这么多事情我讨厌那些让选民失望的事情

【参考方案1】：

画布在 HTML 5 中

HTML 元素用于通过 javascript 动态绘制图形。

元素只是图形的容器。您必须使用 JavaScript 来实际绘制图形。

Canvas 有多种绘制路径、框、圆、文本和添加图像的方法。

check this link

我在下面添加了一个示例，

<canvas id="myCanvas"   style="border:1px solid #000000;">
Your browser does not support the HTML5 canvas tag.
</canvas>

【讨论】：

我真的很困惑，但现在清楚了....我还有另一个疑问..我是一名 corelDRAW 设计师，我可以将设计从 corelDRAW 转换为 HTML 吗？有没有可能？ @梦想猎人

似乎不建议从 cdr 转换为 HTML？ @梦想猎人

@VjRagavan 请将其作为新问题发布

【参考方案2】：

来自MDN docs：

在 HTML5 中添加的 HTML <canvas> 元素可用于通过 JavaScript 脚本绘制图形。例如，它可用于绘制图形、制作照片合成、创建动画，甚至可以进行实时视频处理或渲染。

从这里开始：Canvas tutorial by MDN