HTML中SVG和CANVAS有什么区别?

 我来答
苍狼_白鹿
2018-01-05 · TA获得超过11.8万个赞
知道大有可为答主
回答量:1.9万
采纳率:82%
帮助的人:5406万
展开全部
区别一:
svg绘制出来的每一个图形的元素都是独立的DOM节点,能够方便的绑定事件或用来修改。canvas输出的是一整幅画布;

区别二:
svg输出的图形是矢量图形,后期可以修改参数来自由放大缩小,不会是真和锯齿。而canvas输出标量画布,就像一张图片一样,放大会失真或者锯齿。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
同睿好0R
2018-05-28 · TA获得超过100个赞
知道答主
回答量:0
采纳率:0%
帮助的人:0
展开全部

SVG 是一种使用 XML 描述 2D 图形的语言。

Canvas 通过 JavaScript 来绘制 2D 图形。

1. 对于画在Canvas上的部件,你需要处理重绘。而SVG则不用,你修改svg dom则系统会自动帮你重绘

2.Hittest,即canvas不负责帮你侦测鼠标/触摸事件发生在哪一个图形元件上;而svg可以。

3.Canvas效率高得多canvas的工作方式就像传统的2d图形引擎比如GDI;而SVG的工作方式更像WPF(XAML)、HTML/CSS这类由标记控制的绘图引擎

4.Canvas 是逐像素进行渲染的。在 canvas 中,一旦图形被绘制完成,它就不会继续得到浏览器的关注。如果其位置发生变化,那么整个场景也需要重新绘制,包括任何或许已被图形覆盖的对象。

5.SVG 基于 XML,这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。在 SVG 中,每个被绘制的图形均被视为对象。

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式