SVG与Canvas的特点

        最近在使用SVG做一个地图的编辑器，简单来说就是画多边形的场地以及建筑的俯视图，本来想用Java去写，后来发现使用H5技术写这些更为方便，通过比较了Canvas与SVG后，决定使用SVG来写这个编辑器。

        SVG与Canvas的比较：

        1.SVG具有丰富的DOM接口：这也是我选用SVG而没有使用Canvas最重要的原因，在绘制方面Canvas是逐像素进行渲染的，也就是说，你需要告诉Canvas那个像素点什么颜色，他就会老老实实的把这个像素点画出来，但是要让它处理点击事件，拖动事件就要费功夫了，需要自己写很多事件触发的代码。而SVG则不同SVG是将每个绘制的元素当成一个对象，天生的相应一切网页原生DOM操作，当你需要个给一个矩形添加点击事件时，你只需要addOnClickListener就可以了~可以说是非常方便了。

        2.Canvas绘制效率高：刚才提到了，Canvas只关心我们需要在指定的位置绘制对应像素，这样虽然让我们的交互变得十分麻烦，但是大大提高了绘制效率，反观SVG由于需要支持DOM操作，每个对象的属性值更改时都要进行更新，这样当绘制数据变化比较大或者对实时性要求较高时，就会出现卡顿的现象。

        3.SVG不依赖分辨率：这也是SVG的一大优点，由于SVG绘图时是根据函数公式计算得出的位置，所以在不同分辨率下均能显现出优秀的效果，这一点在适配不同分辨率时大有用处！而Canvas则是基于像素进行渲染的，所以会受到分辨率的影响。

        最后用一张图总结一下Canvas与SVG的区别：