echarts使用transform缩放后导致图标模糊 --的解决办法
当使用了transform: scale(x,y)缩放后致使echarts图表模糊。怎么解决这个问题呢？
第一种解决办法:将canvas转换成svg。
在初始化时就指定渲染器为svg：echarts.init(dom,null,{ renderer : 'svg' });
第一个参数是：echarts的容器。第二个参数是:颜色主题，没有可以设置为null
第三个参数就是说使用用svg渲染器。为什么使用 svg 渲染器就可以解决图表模糊的问题呢？
这里就要说道 canvas和svg的区别了：
需要注意的是：目前的 svg中 富文本、材质功能尚未实现；所以对于效果复杂的echarts图来说不太理想；
但是柱状图，饼状图，折线图是没有任何问题的。可以使用svg渲染器。
canvas和svg的区别
1.canvas通过JS来绘制，只要它的位置发生改变，就得重新绘制 1.svg使用XML的2d语言 2.canvas它是基于像素点，依赖屏幕的分辨率,可能会失真。 2.svg不依赖屏幕分辨率，不会失真 3.canvas适合图像密集的场景如:游戏 3.svg不适合游戏 4.canvas支持颜色比svg多； 5.svg 内存占用更低，渲染性更更高一些。
charts的默然渲染方式是canvas渲染，但是Canvas 数量多也可能会导致内存占用超出设备的承受能力。
一般来说，Canvas 更适合绘制图形元素数量非常大（这一般是由数据量大导致）的图表. (如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等)也利于实现某些视觉 特效。
svg的内存占用更低（这对移动端尤其重要）、渲染性能略高、浏览器缩放功能时不会模糊。 SVG 渲染器在折、柱、饼图上相对canvas更好一些。
