一般会想到 canvas 和 svg ;
svg更适合画图, 但由于cavans在移动端的良好兼容性, 使用的更广;
什么是svg, scalable vector graphics 全称 可缩放矢量图形, 是一种来描述二维矢量图形的xml语言
canvas 能做的 svg基本都可以做, 字体图标, icon, logo 也能作
在ie上也是从ie9开始兼容svg的. 旧浏览器 vml技术, vml类似svg, react 15对svg支持比较完善
echarts选择的是canvas, highcharts选择的是svg, 由于svg的矢量特性, 绘制图形 svg更合理 而且有优势
canvas 支持的库 react-canvas, 这个库主要来生成各类功能的自定义canvas标签
讲到svg, 因为他的表现方式更贴近react使用原生和自定义标签构建组件化的思路, svg嵌套和自定义属性来得到想要的图形
虽然svg性能不太好, 但为什么要选择
我们常见的image sprite 有高清屏幕的兼容问题, 需要做几套图片来兼容, 而svg不存在这个问题
当图标小于16px, 或者图标比较复杂时, 往往会出现图片无法显示清晰的问题,
虽然iconfont能够自动适应个屏幕的分辨率, 但不能解决上面的清晰问题