不重叠且分布均匀的气泡图解决方案（基于echarts）

      气泡图是数据可视化需求中的一种常见图表形式。然而截至目前，像echarts，d3，higncharts都还没有直接提供一个配置来完成不重叠且分布均匀的气泡图这项工作。幸运的是，我们可以通过配置echart的关系图来完成我们的气泡图需求。

     下面是完成后的气泡图效果（数据加载后有一个动画效果，而且气泡支持拖动，下方动图不和谐的地方为鼠标拖动）：

     最终稳定之后的效果如下：

    为了有更好的适用性，这里把绘制气泡图的操作都封装到了一个函数里面。以Vue项目为例，要完成这个气泡图的配置所需步骤如下：

    1：npm下载echarts模块。

    2：在main.js文件中引入关系图相关的模块，并把echart主模块绑定到vue原型对象上，以便后续调用，代码如下：
 

// 引入 EChart 主模块
let echarts = require('echarts/lib/echarts'