echarts水球图实现原理，百分比展示（大屏可视化），echarts-liquidfill是基于echarts实现的，它是echarts的一款插件，我们需要安装使用，水球图的应用场景很广泛，

echarts 水球图可能开发中也会碰到，当然其也不是很复杂，但也是需要一些时间，echarts 中也有水球图这个东西，可以使用其来实现我们的水球图效果，顺便引出 echart 插件市场

这是我参与8月更文挑战的第4天，活动详情查看：8月更文挑战 水球图是一个插件类型的图表，并不是一个echarts的基础图表。在下载echarts后，并没有水球图的api，包括echarts官方图表库，

经过之前环形图需求，对ECharts的使用感觉已经非常熟练了，这次写柱状图的时候就快了很多。 ^_^

Echart v5.3.2 之bar、line、pie的常用基本配置项。内容包括标题title，图例legend，网格布局grid，提示框tooltip，直角坐标系x 轴，数据项series。

我们在平时的业务开发过程中不可避免的会与图表打交道，有时候UI会为图表设计一些特别的Icon进行展示。比如图例（legend）、提示浮层（tooltip）以及表中数据点（symbol）

给echart饼图添加光圈（自适应，定位饼中心）首先是饼图不是位于中心`center: ['50%', '50%']`,而是偏左，另外页面也是自适应。查了`echart`的官网文档，没有直接可配置化的

需求是加外边框，鼠标放上去外边框随着一起突出，如下图所示： 代码如下： ECharts中支持的图表行为，通过 dispatchAction 触发。实现外边框会随着一起突出显示与否

力引导布局是模拟弹簧电荷模型在每两个节点之间添加一个斥力，每条边的两个节点之间添加一个引力，每次迭代节点会在各个斥力和引力的作用下移动位置，多次迭代后节点会静止在一个受力平衡的位置，达到整个模型的能量最小化。 了解了如何实现力导向图，也了解了如何绑定事件，nam就可以在此基础上…