HTML 5 中的画布是啥?

Posted

技术标签:

【中文标题】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 &lt;canvas&gt; 元素可用于通过 JavaScript 脚本绘制图形。例如,它可用于绘制图形、制作照片合成、创建动画,甚至可以进行实时视频处理或渲染。

从这里开始:Canvas tutorial by MDN

【讨论】:

以上是关于HTML 5 中的画布是啥?的主要内容,如果未能解决你的问题,请参考以下文章

将 HTML 5 画布保存到 Chrome 中的文件?

canvas加入代码是啥

如何在 html 5 画布上旋转单个对象?

如何在 html 5 画布中删除区域的剪辑

使用 HTML 5 画布绘制五边形

html5的画布渲染2d.move To()中x和y的单位是啥?