当使用了transform: scale(x,y)缩放后致使echarts图表模糊：添加页面缩放功能势必带来，页面变形模糊；若所开发的分辨率和要显示的分辨率差距较小时，或许影响很小，但是差距变大时，页面显示将会很糟糕（尤其是echarts图标）；
注意：使用transform: scale(x,y)缩放，并不是好的选择，但是有时候由于项目经理在前期开发时未对项目的分辨率做出准确的规定后后期更改，但时间节点要求很短时，使用这种野路子也是能够快速达到要求的不错选择；
解决方法：
针对于echarts不清楚模糊问题有两种解决办法：
（1）、将canvas转换成svg; 在初始化时：echarts.init(dom,null,{ renderer : 'svg' });
拉伸后图片依然清晰，但是有目前的 SVG 版中，富文本、材质功能尚未实现；（所以对于效果复杂的echarts图来说不太理想）；
（2）、使用devicePixelRixelRatio: 2 ；
虽然也不是很完美，但是当echarts的canvas使用的很复杂的时候，不影响属性效果的显示，使用设备像素比，是相当可以的；echarts.init(dom,null,devicePixelRatio:2));
echarts API中有注明；再此只是总结记录；
补充：
关于是使用canvas渲染还是使用svg渲染echarts？
其实还是要根据自己项目的要求来决定；
先来看看canvas和svg区别：
svg
svg是一种使用xml描述2D图形的语言。
svg是基于XML，这意味着svg dom 中的每一个元素都是可用的，您可以为某个元素添加JavaScript事件处理器，在svg中，每个被绘制的图形均被视为对象。如果svg对象的属性发生变化，那么浏览器能够自动重现图形。
特点：
不依赖分辨率；（所以可以解决缩放带来的模糊问题）
支持事件处理器；
最适合支持带有大型渲染区域的应用程序（比如谷歌地图）
复杂度高会减慢渲染速度（任何过度使用dom的应用都不会块；echarts目前的 SVG 版中，富文本、材质功能尚未实现）
不适合游戏应用；
canvas
canvas通过JavaScript来绘制2D图形。
canvas是逐像素进行渲染的。
在canvas中，一旦图形被绘制完成，它就不会继续得到浏览器的关注，如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。
特点：
依赖于分辨率；
不支持事件处理器；
弱的文本渲染能力；
能够以 *.png 或 *.jpg 格式保存结果图像；
最适合图像密集型的游戏，其中的许多对象会被频繁重绘；
echarts的默然渲染方式是canvas渲染，但是Canvas 数量多也可能会导致内存占用超出手机承受能力；
选择哪种渲染器？
一般来说，Canvas 更适合绘制图形元素数量非常大（这一般是由数据量大导致）的图表（如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等），也利于实现某些视觉 特效。但是，在不少场景中，SVG 具有重要的优势：它的内存占用更低（这对移动端尤其重要）、渲染性能略高、并且用户使用浏览器内置的缩放功能时不会模糊。例如，我们在一些硬件环境中分别使用 Canvas 渲染器和 SVG 渲染器绘制中等数据量的折、柱、饼，统计初始动画阶段的帧率，得到了一个性能对比图：
选择哪种渲染器，我们可以根据软硬件环境、数据量、功能需求综合考虑。
- 在软硬件环境较好，数据量不大的场景下（例如 PC 端做商务报表），两种渲染器都可以适用，并不需要太多纠结。
- 在环境较差，出现性能问题需要优化的场景下，可以通过试验来确定使用哪种渲染器。比如有这些经验：
- 在须要创建很多 ECharts 实例且浏览器易崩溃的情况下（可能是因为 Canvas 数量多导致内存占用超出手机承受能力），可以使用 SVG 渲染器来进行改善。大略得说，如果图表运行在低端安卓机，或者我们在使用一些特定图表如 水球图 等，SVG 渲染器可能效果更好。
- 数据量很大、较多交互时，可以选用 Canvas 渲染器。
参考资料：www.echartsjs.com/zh/tutorial…