html5 画布和SVG的差别
canvas和SVG可以在浏览器绘制图形,但是本质上是不同的。canves是绘制2d图象,SVG也是绘制2d图象。
Canvas是Javascript进行绘图的,是逐像素绘图。Canvas一旦图象绘制完成,就于浏览器无关了,图象的位置发生变化,整个场景都需要重新重新绘制,包括已经被覆盖的元素。
svg是使用xml绘制,可以为svg添加javascript的事件处理器。所有的DOM都是可用的,属性发生变化,浏览器会自动重新绘制。
SVG和Canvas的不同:
svg支持事件处理器,而Canvas不支持;
svg是通过XML定义的,而Canvas是通过javascript定义的。
Canvas可以保存为png或者jpg格式;
Canvas适合游戏场景绘图,很多对象需要频繁重绘,而SVG不适合游戏场景绘图;
Canvas支持分辨率,SVG不支持分辨率;
Canvas弱文本渲染能力,SVG适合带有大型渲染区域的应用程序;
SVG复杂度高会减慢绘图速度。
html5 画布和SVG的差别的更多相关文章
- html5 中的SVG 和canvas
想到昨天看资料的时候,发现html5 中的SVG 和canvas 都可以表示图形,那它们到底有哪些区别呢?该如何正确的使用它们呢? 1.SVG:可缩放矢量图形,(Scalable Vector Gra ...
- HTML5中的SVG
* SVG * 基本内容 * SVG并不属于HTML5专有内容 * HTML5提供有关SVG原生的内容 * 在HTML5出现之前,就有SVG内容 * SVG,简单来说就是矢量图 * SVG文件的扩展名 ...
- HTML5画布(CANVAS)速查简表
HTML5画布(CANVAS)速查简表 http://www.webhek.com/misc/html5-canvas-cheat-sheet/
- HTML5画布生成的3D飞船舰队效果
在线演示 本地下载 使用HTML5画布2D来模拟3D的空间效果,生成舰队飞行效果,了解如何开发,请阅读下面代码相关“轻视频”: HTML5画布模拟生成3D的舰队飞行效果
- 使用HTML5画布(canvas)生成阴影效果
来源:GBin1.com 使用HTML5的画布特性,我们可以创建图形,在这片文章中,我们将创建图形的阴影. var canvas = document.getElementById('shadowca ...
- html5 Canvas和SVG的区别是什么(总结)
html5 Canvas和SVG的区别是什么(总结) 一.总结 一句话总结:都是2D做图,svg是矢量图,canvas是位图.Canvas 是逐像素进行渲染的,适合游戏. 1.svg的全称是什么? S ...
- HTML5: HTML5 内联 SVG
ylbtech-HTML5: HTML5 内联 SVG 1.返回顶部 1. HTML5 内联 SVG HTML5 支持内联 SVG. 什么是SVG? SVG 指可伸缩矢量图形 (Scalable Ve ...
- html5中画布和SVG的比较
SVG是基于XML的图形语言,在DOM解析中其每个元素都是可以用的,这样就可以为SCG元素附加JavaScript事件处理器,实现更加丰富的效果. 在SVG中,每个被绘制的图形均被视为对象,如果SVG ...
- HTML5学习之画布和SVG(四)
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
随机推荐
- @synchronized深入理解
@synchronized是线程同步锁,易用.可读性高. @synchronized(self) { 临界区 } 利用如下命令将其重写 clang -rewrite-objc file 得到C++实 ...
- Excel 2007 底层实现方式
一.EXCEL的底层实现 能力有限,了解的比较浅,有不足之处望指正,首先看下图: 一. excel2007是使用xml格式来存储的,把一个excel文件后缀改为.zip,打开之后就直接可以看到一个ex ...
- [拍摄]日本AVENIR 6-36mm老式变焦镜头拆解 型号SSL06036M
老式监控摄像头的变焦镜头,做工不错,拆了分享一下 品牌:AVENIR型号:SSL06036M光圈:1:1.2产地:日本焦距:6-36mm 外观 图片:QQ截图20141104125759.jpg 图片 ...
- CF28D Don't fear, DravDe is kind 背包
题目传送门:http://codeforces.com/problemset/problem/28/D 题意:给你$N$个物品,每个物品有其价格$P_i$,之前必须要买的物品价格和$L_i$,之后必须 ...
- C# 队列和栈 线程安全
队列是其元素以先进先出(FIFO)的方式来处理集合,先入队的元素会先读取. 栈是和队列非常类似的另一个容器,栈和队列最大的区别是后进先出(LIFO),也可以说成先进后出. 队列在现实生活中的例子数不胜 ...
- DOS文件转换成UNIX文件格式详解
转:DOS文件转换成UNIX文件格式详解 由windows平台迁移到unix系统下容易引发的问题:Linux执行脚本却提示No such file or directory dos格式文件传输到uni ...
- 如何使用chrome浏览器进行js调试找出元素绑定的点击事件
大家有没有遇到这样的一个问题,我们在分析一些大型电子商务平台的Web前端脚本时,想找到一个元素绑定的点击事件,并不是那么容易,因为有些前端脚本封装的比较隐蔽,甚至有些加密脚本,用传统的查找元素ID.或 ...
- item 7:当创建对象的时候,区分()和{}的使用
本文翻译自modern effective C++,由于水平有限,故无法保证翻译完全正确,欢迎指出错误.谢谢! 博客已经迁移到这里啦 从不同的角度来看,在C++11中,对象初始化拥有多种语法选择,这体 ...
- Http指南(1)
网关:是一种特殊的服务器,作为其他服务器的中间实体使用; Agent代理:所有发布web请求的应用程序都是HTTP Agent代理.Web浏览器其实就是一种代理; HTTP报文是在HTTP应用程序之间 ...
- 【微服务】使用spring cloud搭建微服务框架,整理学习资料
写在前面 使用spring cloud搭建微服务框架,是我最近最主要的工作之一,一开始我使用bubbo加zookeeper制作了一个基于dubbo的微服务框架,然后被架构师否了,架构师曰:此物过时.随 ...