SVG和HTML5画布有什么不同?他们似乎都对我做了同样的事.基本上,它们都使用坐标点绘制矢量插图.

我遗漏了什么?SVG和HTML5画布之间的主要区别是什么?为什么我要 Select 一个而不是另一个呢?

推荐答案

参见维基百科:http://en.wikipedia.org/wiki/Canvas_element

SVG是早期的绘图标准

在上面的示例中,一旦 绘制矩形,事实是它 被系统遗忘了. 如果它的位置改变了, 整个场景需要 重绘,包括任何符合以下条件的对象 可能已经被 矩形.但在等价的SVG中 情况下,只需更改 矩形的位置属性 浏览器将确定如何 重新粉刷一下.此外,还可以执行以下操作 分层绘制画布,然后 重新创建特定图层.

SVG图像用XML表示,并且 可以创建复杂的场景并 使用XML编辑工具进行维护.

SVG场景图启用事件

从概念上讲,画布是一个较低的层次

更新: 我使用SVG是因为它的标记语言能力-它可以由XSLT处理,并且可以在其 node 中保存其他标记.同样,我可以在我的标记中保留SVG(化学).这允许我通过组合标记来操作SVG属性(例如,呈现).这在画布上可能是可能的,但我怀疑要难得多.

Html相关问答推荐

Bootstrap右和左颈部

关于角内按钮范围的混乱

你能让Cypress测试为p—fileUpload做文件上传吗?

Chrome中是否有一个本地显示密码功能,用于`input type = password/`?""<"">

如何在angular 17.2中使用routerLink解决此错误

如何通过扭曲元素来倾斜元素?

嵌套表列高度不是100%高度的问题

为什么前端框架可以创建自定义属性,而我却被期望在挖掘之前添加数据

从网页中提取URL

如何更改Django中的默认按钮?

十进制数字不适用于格网项目的格网布局线放置中使用的SPAN关键字

浏览器是否可以呈现存储在代码点0x09处的字形?

Django HTML标记-Merge for Loop with Conditional语句

按钮位于主 div 的底部而不是内部 Div

如何使Bootstrap 5卡可点击

发送带有图像的Google文档作为HTML格式的邮件正文不再起作用

W3Schools 幻灯片相同高度

是否可以将文本添加到表格边框?

需要禁用聚焦输入的工具提示(jquery)

如何使用 html 和 css 为卡片创建此背景框架