标签：的区别 mil line str 像素 完成 ext 谷歌地图 mic
canvas是通过javascript来绘制的2D图形
canvas是控制像素来渲染的
一旦渲染完成，浏览器就不会关注了，如果位置发生变化，整个场景就需要重新绘制
<canvas id="mycanvas" width="500" height="300" ></canvas> <script type="text/javascript"> var c=document.getElementById("mycanvas"); var cxt=c.getContext("2d"); cxt.fillStyle="#FF0000"; cxt.fillRect(0,0,150,75); // 画了一条线 cxt.moveTo(160,0) cxt.lineTo(160,90) cxt.stroke() // 画一个圆 cxt.fillStyle="#FF0000" cxt.beginPath(); cxt.arc(200,100,15,0,Math.PI*2,true); cxt.closePath(); cxt.fill(); // 图像 var img=new Image() img.src="./video/QQ图片20190529164332.jpg" cxt.drawImage(img,100,100) </script>
Svg是使用xml描述的2D图形
也就意味着svg dom里面每个元素都是可用的，可以使用事件处理器
Svg的属性发生变化，浏览器可以自动重现图形
区别：
canvas svg
分辨率： 依赖 不依赖
支持事件处理: 不支持 支持
文本渲染能力: 弱的文本渲染 最适合带有大型渲染区域的应用程序（比如谷歌地图）
适合游戏： 适合密集型游戏 不适合游戏应用
标签：的区别 mil line str 像素 完成 ext 谷歌地图 mic
原文地址：https://www.cnblogs.com/zhuMother/p/12199831.html
