echart自定义动画_echartGL动态水球效果

1. 需求描述

前提：该水球效果实现是基于 echartGL ,所以需要引用echart脚本库，echartsGl库，和水球定义的脚本文件

效果图：

2. 实现步骤

步骤一：将需要使用到的脚本文件上传到资源管理器中

步骤二：在客户端 脚本中使用如下语法，引用资源管理器中的脚本

include("vfs/root/js/circle/echarts.min.js");

include("vfs/root/js/circle/echarts-gl.min.js");

include("vfs/root/js/circle/echarts-liquidfill.min.js")

*include是用来引用js后缀的脚本库的，1、引用资源管理器中上传脚本2、引用系统自带echarts2版本脚本3、引用网页脚本资源(例如谷歌gis地图)

步骤三：水球内容实现

在界面拖入一个容器，例如容器HHH2，然后通过在客户端脚本中通过一句话，可以实现最后水球 在界面上初始化的位置

var myChart = echarts.init(document.getElementById("HHH2"));

设置水球option数据样式等信息

var option = {

series: [{

type: "liquidFill",

radius: "80%",

//shape: "roundRect&#