zhbyyy 2 anni fa
parent
commit
797e4bca6c

BIN
investmentNew/img/centerTop1.png


BIN
investmentNew/img/centerTop2.png


BIN
investmentNew/img/centerTop3.png


BIN
investmentNew/img/centerTop4.png


+ 12 - 7
investmentNew/index.html

@@ -17,6 +17,7 @@
     <script src="./js/map/china.json"></script>
     <script src="./js/Data.js"></script>
     <script src="./libs/echarts-tooltip-carousel.js"></script>
+    <script src="./libs/echarts-liquidfill.min.js"></script>
   </head>
 
   <body>
@@ -543,7 +544,9 @@
             </div>
             <div>
               <div class="title">投资产业分布</div>
-              <div class="content"></div>
+              <div class="content">
+                <div style="width: 100%;height: 100%;" ref="leftEcharts12"></div>
+              </div>
             </div>
             <div>
               <div class="title">投资执行情况</div>
@@ -555,7 +558,7 @@
               <div class="flex justify-center flex-col">
                 <div>
                   <div
-                    style="font-size: 60px; color: #68bdff; font-weight: bold"
+                    style="font-size: 60px; color: #5bdcc8; font-weight: bold"
                   >
                     17.09<span style="font-size: 28px">亿</span>
                   </div>
@@ -567,7 +570,7 @@
               <div class="flex justify-center flex-col">
                 <div>
                   <div
-                    style="font-size: 60px; color: #5bdcc8; font-weight: bold"
+                    style="font-size: 60px; color: #68bdff; font-weight: bold"
                   >
                     353.07<span style="font-size: 28px">亿</span>
                   </div>
@@ -579,7 +582,7 @@
               <div class="flex justify-center flex-col">
                 <div>
                   <div
-                    style="font-size: 60px; color: #5bdcc8; font-weight: bold"
+                    style="font-size: 60px; color: #68bdff; font-weight: bold"
                   >
                     2.22<span style="font-size: 28px">亿</span>
                   </div>
@@ -591,7 +594,7 @@
               <div class="flex justify-center flex-col">
                 <div>
                   <div
-                    style="font-size: 60px; color: #68bdff; font-weight: bold"
+                    style="font-size: 60px; color: #5bdcc8; font-weight: bold"
                   >
                     66.28<span style="font-size: 28px">亿</span>
                   </div>
@@ -609,7 +612,7 @@
               <div class="center3" ref="leftEcharts9"></div>
             </div>
           </div>
-          <div>
+          <div class="center4">
             <div>
               <div>
                 <div class="title">五个一体化</div>
@@ -619,7 +622,9 @@
             <div>
               <div>
                 <div class="title">投资阶段分析</div>
-                <div class="content"></div>
+                <div class="content">
+                  <div ref="leftEcharts13" style="height: 100%;width: 100%;"></div>
+                </div>
               </div>
             </div>
             <div>

+ 1 - 0
investmentNew/js/Data.js

@@ -132,3 +132,4 @@ left1 = [
     }
   ]
 ]
+let left2 = [0.30, 1323.85]

+ 611 - 50
investmentNew/js/index.js

@@ -1,6 +1,6 @@
 let app = new Vue({
   el: "#app",
-  data() {
+  data () {
     return {
       count: 0, //重点项目两线指标轮到哪个
       list: [], //重点项目两线指标数组
@@ -16,6 +16,8 @@ let app = new Vue({
       leftEcharts9: "",
       leftEcharts10: "",
       leftEcharts11: "",
+      leftEcharts12: '',
+      leftEcharts13: '',
       shanxiMap: "", // 山西地图
       industryProportion: 1, // 主辅业占比轮播
       industryLayout: 0, //产业布局分析
@@ -380,13 +382,13 @@ let app = new Vue({
       },
     };
   },
-  created() {},
-  beforeDestroy() {
+  created () { },
+  beforeDestroy () {
     clearInterval(this.timer);
     clearInterval(this.time1);
     clearInterval(this.time2);
   },
-  mounted() {
+  mounted () {
     this.time4s();
     this.timeNs();
     this.filterLpData();
@@ -403,6 +405,8 @@ let app = new Vue({
       this.leftEcharts9Fun();
       this.leftEcharts10Fun();
       this.leftEcharts11Fun();
+      this.leftEcharts12Fun();
+      this.leftEcharts13Fun();
       this.chinaEchartsFun();
       this.initChartR1();
       this.initChartR2();
@@ -410,7 +414,7 @@ let app = new Vue({
     });
   },
   methods: {
-    initChartR1() {
+    initChartR1 () {
       let right5 = [
         [
           ["山西焦煤", 43.8],
@@ -676,7 +680,7 @@ let app = new Vue({
         loopSeries: true,
       });
     },
-    initChartR2() {
+    initChartR2 () {
       let that = this;
       that.right1Chart = echarts.init(this.$refs["echartR2"]);
       that.right1Chart.on("showTip", (params) => {
@@ -916,7 +920,7 @@ let app = new Vue({
         loopSeries: true,
       });
     },
-    initChartR3() {
+    initChartR3 () {
       let that = this;
       that.right3Chart = echarts.init(this.$refs["echartR3"]);
       let option = {
@@ -979,7 +983,7 @@ let app = new Vue({
       };
       that.right3Chart.setOption(option);
     },
-    initChartR4() {
+    initChartR4 () {
       let that = this;
       that.right4Chart = echarts.init(this.$refs["echartR4"]);
       that.right4Chart.on("showTip", (params) => {
@@ -1340,14 +1344,14 @@ let app = new Vue({
         loopSeries: true,
       });
     },
-    clickItem(index) {
+    clickItem (index) {
       const angle = 360 / this.investData.investList.length;
       this.witchs = index;
       this.inner = index;
       this.innerDeg = this.witchs * angle;
       this.lpRotate();
     },
-    lpRotate() {
+    lpRotate () {
       const angle = 360 / this.investData.investList.length;
       clearInterval(this.timer);
       this.timer = setInterval(() => {
@@ -1358,7 +1362,7 @@ let app = new Vue({
         this.innerDeg = this.inner * angle;
       }, 2000);
     },
-    filterLpData() {
+    filterLpData () {
       const angle = 360 / this.investData.investList.length;
       for (let i in this.investData.investList) {
         this.investData.investList[i].deg = i * angle;
@@ -1369,7 +1373,7 @@ let app = new Vue({
       }
     },
     // 4秒定时器
-    time4s() {
+    time4s () {
       let that = this;
       // 4秒定时器
       this.time1 = setInterval(() => {
@@ -1387,7 +1391,7 @@ let app = new Vue({
       }, 4000);
     },
     // 针对投前产业布局分析的定时器
-    timeNs() {
+    timeNs () {
       let that = this;
       this.time2 = setInterval(() => {
         if (that.industryLayout < 3) {
@@ -1402,7 +1406,7 @@ let app = new Vue({
       }, left1[that.industryLayout].length * 2000);
     },
     // 主辅业占比点击方法
-    industryProportionChange(e) {
+    industryProportionChange (e) {
       let that = this;
       this.industryProportion = e;
       this.time1 && clearInterval(this.time1);
@@ -1417,18 +1421,18 @@ let app = new Vue({
       this.time4s();
     },
     // 产业布局分析点击方法
-    industryLayoutChange(e) {
+    industryLayoutChange (e) {
       this.industryLayout = e;
       this.time2 && clearInterval(this.time2);
       this.leftEcharts5.dispose();
       this.timeNs();
       this.leftEcharts5Fun();
     },
-    yuanChange(value) {
+    yuanChange (value) {
       return Number((value / 100000000).toFixed(2));
     },
     // 逢三折断
-    numFormat(value) {
+    numFormat (value) {
       if (!value) return "0";
       // var intPart = Number(value).toFixed(0) // 获取整数部分
       var intPart = parseInt(value); // 获取整数部分
@@ -1452,7 +1456,7 @@ let app = new Vue({
         return intPartFormat;
       }
     },
-    leftEcharts1Fun() {
+    leftEcharts1Fun () {
       let that = this;
       this.leftEcharts1 = echarts.init(this.$refs["leftEcharts1"]);
       option = {
@@ -1515,7 +1519,7 @@ let app = new Vue({
       //注册
       that.leftEcharts1.setOption(option);
     },
-    leftEcharts2Fun() {
+    leftEcharts2Fun () {
       let that = this;
       this.leftEcharts2 = echarts.init(this.$refs["leftEcharts2"]);
       let nameList = ["a"];
@@ -1729,7 +1733,7 @@ let app = new Vue({
       //注册
       that.leftEcharts2.setOption(option);
     },
-    leftEcharts3Fun() {
+    leftEcharts3Fun () {
       let that = this;
       this.leftEcharts3 = echarts.init(this.$refs["leftEcharts3"]);
       option = {
@@ -1792,7 +1796,7 @@ let app = new Vue({
       //注册
       that.leftEcharts3.setOption(option);
     },
-    leftEcharts4Fun() {
+    leftEcharts4Fun () {
       let that = this;
       this.leftEcharts4 = echarts.init(this.$refs["leftEcharts4"]);
       let nameList = ["a"];
@@ -2006,7 +2010,7 @@ let app = new Vue({
       //注册
       that.leftEcharts4.setOption(option);
     },
-    leftEcharts5Fun() {
+    leftEcharts5Fun () {
       let that = this;
       this.leftEcharts5 = echarts.init(this.$refs["leftEcharts5"]);
       let dataList = [];
@@ -2036,11 +2040,9 @@ let app = new Vue({
         tooltip: {
           trigger: "item",
           formatter: function (e) {
-            return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${
-              e.borderColor
-            };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${
-              left1[that.industryLayout][e.seriesIndex].num
-            }个`;
+            return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${e.borderColor
+              };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${left1[that.industryLayout][e.seriesIndex].num
+              }个`;
           },
           backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
           textStyle: {
@@ -2056,7 +2058,7 @@ let app = new Vue({
           left: "75%",
           textStyle: {
             color: "#fff",
-            fontSize: 28,
+            fontSize: 20,
             padding: [0, 20],
           },
         },
@@ -2128,7 +2130,7 @@ let app = new Vue({
       //注册
       that.leftEcharts5.setOption(option);
     },
-    leftEcharts6Fun() {
+    leftEcharts6Fun () {
       let that = this;
       this.leftEcharts6 = echarts.init(this.$refs["leftEcharts6"]);
       var dataArr = 44;
@@ -2408,7 +2410,7 @@ let app = new Vue({
       //注册
       that.leftEcharts6.setOption(option);
     },
-    leftEcharts7Fun() {
+    leftEcharts7Fun () {
       let that = this;
       this.leftEcharts7 = echarts.init(this.$refs["leftEcharts7"]);
       let option = {
@@ -2583,7 +2585,7 @@ let app = new Vue({
       //注册
       that.leftEcharts7.setOption(option);
     },
-    leftEcharts8Fun() {
+    leftEcharts8Fun () {
       let that = this;
       this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]);
       let option = {
@@ -2752,7 +2754,7 @@ let app = new Vue({
       //注册
       that.leftEcharts8.setOption(option);
     },
-    chinaEchartsFun() {
+    chinaEchartsFun () {
       let that = this;
       this.geoCoordMap = [];
       /*获取地图数据*/
@@ -3144,7 +3146,7 @@ let app = new Vue({
             data: [
               {
                 name: "太原市",
-                value: [112.53, 37.87, 25167],
+                value: [112.53, 37.87, 25167, 113],
               },
             ],
             symbolSize: function (val) {
@@ -3204,7 +3206,7 @@ let app = new Vue({
       });
       this.shanxiMap.setOption(option);
     },
-    leftEcharts9Fun() {
+    leftEcharts9Fun () {
       let that = this;
       this.leftEcharts9 = echarts.init(this.$refs["leftEcharts9"]);
       // var ROOT_PATH = 'https://echarts.apache.org/examples';
@@ -3233,7 +3235,7 @@ let app = new Vue({
       };
       that.leftEcharts9.setOption(option);
     },
-    leftEcharts10Fun() {
+    leftEcharts10Fun () {
       let that = this;
       this.leftEcharts10 = echarts.init(this.$refs["leftEcharts10"]);
       option = {
@@ -3247,17 +3249,14 @@ let app = new Vue({
           show: true,
           trigger: "axis",
           formatter: (data) => {
-            return `${
-              data[0].name
-            }<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${
-              data[0].color
-            }"></span> ${data[0].seriesName}:${that.numFormat(
-              data[0].value
-            )}亿<br/><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${
-              data[1].color.colorStops[0].color
-            }"></span> ${data[1].seriesName}:${that.numFormat(
-              data[1].value
-            )}亿`;
+            return `${data[0].name
+              }<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color
+              }"></span> ${data[0].seriesName}:${that.numFormat(
+                data[0].value
+              )}亿<br/><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[1].color.colorStops[0].color
+              }"></span> ${data[1].seriesName}:${that.numFormat(
+                data[1].value
+              )}亿`;
           },
           axisPointer: {
             // 坐标轴指示器,坐标轴触发有效
@@ -3370,11 +3369,11 @@ let app = new Vue({
               color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                 {
                   offset: 0,
-                  color: "#b9b7c060",
+                  color: "#b9b7c030",
                 },
                 {
                   offset: 1,
-                  color: "#b9b7c060",
+                  color: "#b9b7c030",
                 },
               ]),
             },
@@ -3390,7 +3389,7 @@ let app = new Vue({
       that.leftEcharts10.setOption(option);
     },
     // 重点项目两线指标轮播方法
-    scrollChange(index) {
+    scrollChange (index) {
       if (index == 18) {
         this.count = -1;
       } else {
@@ -3411,7 +3410,7 @@ let app = new Vue({
       this.leftEcharts11 ? this.leftEcharts11.dispose() : "";
       this.leftEcharts11Fun();
     },
-    leftEcharts11Fun() {
+    leftEcharts11Fun () {
       let that = this;
       this.leftEcharts11 = echarts.init(this.$refs["leftEcharts11"]);
       option = {
@@ -3429,6 +3428,14 @@ let app = new Vue({
           axisPointer: {
             type: "shadow",
           },
+          backgroundColor: "rgba(50,50,50,0.7)",
+          borderColor: "rgba(50,50,50,0.7)",
+          textStyle: {
+            color: "#fff",
+            fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
+            fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
+            fontSize: "28", // 文字字体大小
+          }
         },
         grid: {
           top: "10%",
@@ -3568,5 +3575,559 @@ let app = new Vue({
       //注册
       that.leftEcharts11.setOption(option);
     },
+    leftEcharts12Fun () {
+      let that = this;
+      this.leftEcharts12 = echarts.init(this.$refs["leftEcharts12"]);
+      var totalData = [{
+        name: '传统产业',
+        value: 12,
+        radio: 0.13
+      }, {
+        name: '公共基础产业',
+        value: 52,
+        radio: 0.01
+      }, {
+        name: '战略性新兴产业',
+        value: 15,
+        radio: 3.9
+      }, {
+        name: '特色优势产业',
+        value: 56,
+        radio: 10.5
+      }];
+
+      var data = [];
+      for (var i = 0; i < totalData.length; i++) {
+        data.push({
+          value: totalData[i].value,
+          name: totalData[i].name,
+          itemStyle: {
+            normal: {
+              borderWidth: 8,
+              shadowBlur: 0,
+              borderColor: commonColor[i],
+              shadowColor: commonColor[i]
+            }
+          }
+        },
+          {
+            value: 5,
+            name: '',
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false
+                },
+                labelLine: {
+                  show: false
+                },
+                color: 'rgba(0, 0, 0, 0)',
+                borderColor: 'rgba(0, 0, 0, 0)',
+                borderWidth: 0
+              }
+            }
+          }
+        );
+      }
+      var seriesOption = [
+        {
+          name: '',
+          type: 'pie',
+          clockWise: false,
+          radius: [170, 160],
+          center: [260, 250],
+          hoverAnimation: false,
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              }
+            }
+          },
+          data: data
+        },
+        {
+          type: 'pie',
+          radius: [120, 120],
+          center: [260, 250],
+          zlevel: 3,
+          silent: true,
+          label: {
+            normal: {
+              show: false
+            },
+          },
+          labelLine: {
+            normal: {
+              show: false
+            }
+          },
+          data: _pie3()
+        },
+        {
+          type: "liquidFill",
+          radius: "40%",
+          data: [left2[0], left2[0] + 0.05, left2[0] - 0.05],
+          center: [260, 250],
+          backgroundStyle: {
+            color: {
+              type: "radial",
+              x: 0.5,
+              y: 0.5,
+              r: 0.5,
+              // 水球体颜色
+              colorStops: [
+                {
+                  offset: 0,
+                  color: "#010a11",
+                },
+                {
+                  offset: 0.75,
+                  // color: "#203852",
+                  color: "#1a2f45",
+                },
+                {
+                  offset: 1,
+                  // color: "#354e6d",
+                  color: "#2b405a",
+                  // color: "#314967",
+                },
+              ],
+              globalCoord: false,
+            },
+          },
+          outline: {
+            borderDistance: 0,
+            itemStyle: {
+              borderWidth: 0,
+              borderColor: {
+                type: "linear",
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                ],
+                globalCoord: false,
+              },
+            },
+          },
+          color: [
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#237386',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            },
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#2F97A9',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            },
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#48E0ED',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            }
+          ],
+          label: {
+            normal: {
+              textStyle: {
+                color: "#58E6F7", // x轴文字颜色
+              },
+            },
+          },
+        },
+      ];
+      option = {
+        color: commonColor,
+        title: {
+          show: false,
+          text: '风险类型123',
+          top: '48%',
+          textAlign: "center",
+          left: "49%",
+          textStyle: {
+            color: '#fff',
+            fontSize: 18,
+            fontWeight: '400'
+          }
+        },
+        tooltip: {
+          show: false
+        },
+        legend: {
+          icon: "circle",
+          orient: 'vertical',
+          formatter: function (name) {
+            let num
+            for (let i = 0; i < totalData.length; i++) {
+              if (totalData[i].name === name) {
+                num = name + ':' + totalData[i].value + '(' + totalData[i].radio + '%' + ')'
+              }
+            }
+            return num
+          },
+          data: ['传统产业', '公共基础产业', '战略性新兴产业', '特色优势产业'],
+          right: 0,
+          bottom: 0,
+          align: 'left',
+          textStyle: {
+            color: '#FFF',     // 文字的颜色
+            fontSize: '20',    // 文字字体大小
+            fontFamily: 'Microsoft YaHei'
+          },
+          itemGap: 20
+        },
+        toolbox: {
+          show: false
+        },
+        series: seriesOption
+      }
+
+      function _pie3 () {
+        let dataArr = [];
+        for (var i = 0; i < 100; i++) {
+          if (i % 2 === 0) {
+            dataArr.push({
+              name: (i + 1).toString(),
+              value: 25,
+              itemStyle: {
+                normal: {
+                  color: "#5A5DE0",
+                  borderWidth: 1,
+                  borderColor: "#5A5DE0"
+                }
+              }
+            })
+          } else {
+            dataArr.push({
+              name: (i + 1).toString(),
+              value: 20,
+              itemStyle: {
+                normal: {
+                  color: "rgba(0,0,0,0)",
+                  borderWidth: 0,
+                  borderColor: "rgba(0,0,0,0)"
+                }
+              }
+            })
+          }
+
+        }
+        return dataArr
+
+      }
+      //轮播
+      tools.loopShowTooltip(that.leftEcharts12, option, {
+        interval: 2000,
+        loopSeries: true,
+      });
+      //注册
+      that.leftEcharts12.setOption(option);
+    },
+    leftEcharts13Fun () {
+      let that = this;
+      this.leftEcharts13 = echarts.init(this.$refs["leftEcharts13"]);
+      var totalData = [{
+        name: '传统产业',
+        value: 12,
+        radio: 0.13
+      }, {
+        name: '公共基础产业',
+        value: 52,
+        radio: 0.01
+      }, {
+        name: '战略性新兴产业',
+        value: 15,
+        radio: 3.9
+      }, {
+        name: '特色优势产业',
+        value: 56,
+        radio: 10.5
+      }];
+
+      var data = [];
+      for (var i = 0; i < totalData.length; i++) {
+        data.push({
+          value: totalData[i].value,
+          name: totalData[i].name,
+          itemStyle: {
+            normal: {
+              borderWidth: 8,
+              shadowBlur: 0,
+              borderColor: commonColor[i],
+              shadowColor: commonColor[i]
+            }
+          }
+        },
+          {
+            value: 5,
+            name: '',
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false
+                },
+                labelLine: {
+                  show: false
+                },
+                color: 'rgba(0, 0, 0, 0)',
+                borderColor: 'rgba(0, 0, 0, 0)',
+                borderWidth: 0
+              }
+            }
+          }
+        );
+      }
+      var seriesOption = [
+        {
+          name: '',
+          type: 'pie',
+          clockWise: false,
+          radius: [170, 160],
+          center: [260, 250],
+          hoverAnimation: false,
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              }
+            }
+          },
+          data: data
+        },
+        {
+          type: 'pie',
+          radius: [120, 120],
+          center: [260, 250],
+          zlevel: 3,
+          silent: true,
+          label: {
+            normal: {
+              show: false
+            },
+          },
+          labelLine: {
+            normal: {
+              show: false
+            }
+          },
+          data: _pie3()
+        },
+        {
+          type: "liquidFill",
+          radius: "40%",
+          data: [left2[0], left2[0] + 0.05, left2[0] - 0.05],
+          center: [260, 250],
+          backgroundStyle: {
+            color: {
+              type: "radial",
+              x: 0.5,
+              y: 0.5,
+              r: 0.5,
+              // 水球体颜色
+              colorStops: [
+                {
+                  offset: 0,
+                  color: "#010a11",
+                },
+                {
+                  offset: 0.75,
+                  // color: "#203852",
+                  color: "#1a2f45",
+                },
+                {
+                  offset: 1,
+                  // color: "#354e6d",
+                  color: "#2b405a",
+                  // color: "#314967",
+                },
+              ],
+              globalCoord: false,
+            },
+          },
+          outline: {
+            borderDistance: 0,
+            itemStyle: {
+              borderWidth: 0,
+              borderColor: {
+                type: "linear",
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                ],
+                globalCoord: false,
+              },
+            },
+          },
+          color: [
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#237386',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            },
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#2F97A9',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            },
+            {
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: '#48E0ED',
+              },
+              {
+                offset: 1,
+                color: '#0078C8',
+              },],
+            }
+          ],
+          label: {
+            normal: {
+              textStyle: {
+                color: "#58E6F7", // x轴文字颜色
+              },
+            },
+          },
+        },
+      ];
+      option = {
+        color: commonColor,
+        title: {
+          show: false,
+          text: '风险类型123',
+          top: '48%',
+          textAlign: "center",
+          left: "49%",
+          textStyle: {
+            color: '#fff',
+            fontSize: 18,
+            fontWeight: '400'
+          }
+        },
+        tooltip: {
+          show: false
+        },
+        legend: {
+          icon: "circle",
+          orient: 'vertical',
+          formatter: function (name) {
+            let num
+            for (let i = 0; i < totalData.length; i++) {
+              if (totalData[i].name === name) {
+                num = name + ':' + totalData[i].value + '(' + totalData[i].radio + '%' + ')'
+              }
+            }
+            return num
+          },
+          data: ['传统产业', '公共基础产业', '战略性新兴产业', '特色优势产业'],
+          right: 0,
+          bottom: 0,
+          align: 'left',
+          textStyle: {
+            color: '#FFF',     // 文字的颜色
+            fontSize: '20',    // 文字字体大小
+            fontFamily: 'Microsoft YaHei'
+          },
+          itemGap: 20
+        },
+        toolbox: {
+          show: false
+        },
+        series: seriesOption
+      }
+
+      function _pie3 () {
+        let dataArr = [];
+        for (var i = 0; i < 100; i++) {
+          if (i % 2 === 0) {
+            dataArr.push({
+              name: (i + 1).toString(),
+              value: 25,
+              itemStyle: {
+                normal: {
+                  color: "#5A5DE0",
+                  borderWidth: 1,
+                  borderColor: "#5A5DE0"
+                }
+              }
+            })
+          } else {
+            dataArr.push({
+              name: (i + 1).toString(),
+              value: 20,
+              itemStyle: {
+                normal: {
+                  color: "rgba(0,0,0,0)",
+                  borderWidth: 0,
+                  borderColor: "rgba(0,0,0,0)"
+                }
+              }
+            })
+          }
+
+        }
+        return dataArr
+
+      }
+      //轮播
+      tools.loopShowTooltip(that.leftEcharts13, option, {
+        interval: 2000,
+        loopSeries: true,
+      });
+      //注册
+      that.leftEcharts13.setOption(option);
+    },
   },
 });

+ 1688 - 0
investmentNew/libs/echarts-liquidfill.min.js

@@ -0,0 +1,1688 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("echarts"));
+	else if(typeof define === 'function' && define.amd)
+		define(["echarts"], factory);
+	else if(typeof exports === 'object')
+		exports["echarts-liquidfill"] = factory(require("echarts"));
+	else
+		root["echarts-liquidfill"] = factory(root["echarts"]);
+})(self, function(__WEBPACK_EXTERNAL_MODULE_echarts_lib_echarts__) {
+return /******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./index.js":
+/*!******************************!*\
+  !*** ./index.js + 6 modules ***!
+  \******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXTERNAL MODULE: external "echarts"
+var external_echarts_ = __webpack_require__("echarts/lib/echarts");
+;// CONCATENATED MODULE: ./src/liquidFillSeries.js
+
+
+external_echarts_.extendSeriesModel({
+
+    type: 'series.liquidFill',
+
+    optionUpdated: function () {
+        var option = this.option;
+        option.gridSize = Math.max(Math.floor(option.gridSize), 4);
+    },
+
+    getInitialData: function (option, ecModel) {
+        var dimensions = external_echarts_.helper.createDimensions(option.data, {
+            coordDimensions: ['value']
+        });
+        var list = new external_echarts_.List(dimensions, this);
+        list.initData(option.data);
+        return list;
+    },
+
+    defaultOption: {
+        color: ['#294D99', '#156ACF', '#1598ED', '#45BDFF'],
+        center: ['50%', '50%'],
+        radius: '50%',
+        amplitude: '8%',
+        waveLength: '80%',
+        phase: 'auto',
+        period: 'auto',
+        direction: 'right',
+        shape: 'circle',
+
+        waveAnimation: true,
+        animationEasing: 'linear',
+        animationEasingUpdate: 'linear',
+        animationDuration: 2000,
+        animationDurationUpdate: 1000,
+
+        outline: {
+            show: true,
+            borderDistance: 8,
+            itemStyle: {
+                color: 'none',
+                borderColor: '#294D99',
+                borderWidth: 8,
+                shadowBlur: 20,
+                shadowColor: 'rgba(0, 0, 0, 0.25)'
+            }
+        },
+
+        backgroundStyle: {
+            color: '#E3F7FF'
+        },
+
+        itemStyle: {
+            opacity: 0.95,
+            shadowBlur: 50,
+            shadowColor: 'rgba(0, 0, 0, 0.4)'
+        },
+
+        label: {
+            show: true,
+            color: '#294D99',
+            insideColor: '#fff',
+            fontSize: 50,
+            fontWeight: 'bold',
+
+            align: 'center',
+            baseline: 'middle',
+            position: 'inside'
+        },
+
+        emphasis: {
+            itemStyle: {
+                opacity: 0.8
+            }
+        }
+    }
+});
+
+;// CONCATENATED MODULE: ./node_modules/zrender/lib/core/util.js
+var BUILTIN_OBJECT = {
+    '[object Function]': true,
+    '[object RegExp]': true,
+    '[object Date]': true,
+    '[object Error]': true,
+    '[object CanvasGradient]': true,
+    '[object CanvasPattern]': true,
+    '[object Image]': true,
+    '[object Canvas]': true
+};
+var TYPED_ARRAY = {
+    '[object Int8Array]': true,
+    '[object Uint8Array]': true,
+    '[object Uint8ClampedArray]': true,
+    '[object Int16Array]': true,
+    '[object Uint16Array]': true,
+    '[object Int32Array]': true,
+    '[object Uint32Array]': true,
+    '[object Float32Array]': true,
+    '[object Float64Array]': true
+};
+var objToString = Object.prototype.toString;
+var arrayProto = Array.prototype;
+var nativeForEach = arrayProto.forEach;
+var nativeFilter = arrayProto.filter;
+var nativeSlice = arrayProto.slice;
+var nativeMap = arrayProto.map;
+var ctorFunction = function () { }.constructor;
+var protoFunction = ctorFunction ? ctorFunction.prototype : null;
+var methods = {};
+function $override(name, fn) {
+    methods[name] = fn;
+}
+var idStart = 0x0907;
+function guid() {
+    return idStart++;
+}
+function logError() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+    }
+    if (typeof console !== 'undefined') {
+        console.error.apply(console, args);
+    }
+}
+function clone(source) {
+    if (source == null || typeof source !== 'object') {
+        return source;
+    }
+    var result = source;
+    var typeStr = objToString.call(source);
+    if (typeStr === '[object Array]') {
+        if (!isPrimitive(source)) {
+            result = [];
+            for (var i = 0, len = source.length; i < len; i++) {
+                result[i] = clone(source[i]);
+            }
+        }
+    }
+    else if (TYPED_ARRAY[typeStr]) {
+        if (!isPrimitive(source)) {
+            var Ctor = source.constructor;
+            if (Ctor.from) {
+                result = Ctor.from(source);
+            }
+            else {
+                result = new Ctor(source.length);
+                for (var i = 0, len = source.length; i < len; i++) {
+                    result[i] = clone(source[i]);
+                }
+            }
+        }
+    }
+    else if (!BUILTIN_OBJECT[typeStr] && !isPrimitive(source) && !isDom(source)) {
+        result = {};
+        for (var key in source) {
+            if (source.hasOwnProperty(key)) {
+                result[key] = clone(source[key]);
+            }
+        }
+    }
+    return result;
+}
+function merge(target, source, overwrite) {
+    if (!isObject(source) || !isObject(target)) {
+        return overwrite ? clone(source) : target;
+    }
+    for (var key in source) {
+        if (source.hasOwnProperty(key)) {
+            var targetProp = target[key];
+            var sourceProp = source[key];
+            if (isObject(sourceProp)
+                && isObject(targetProp)
+                && !isArray(sourceProp)
+                && !isArray(targetProp)
+                && !isDom(sourceProp)
+                && !isDom(targetProp)
+                && !isBuiltInObject(sourceProp)
+                && !isBuiltInObject(targetProp)
+                && !isPrimitive(sourceProp)
+                && !isPrimitive(targetProp)) {
+                merge(targetProp, sourceProp, overwrite);
+            }
+            else if (overwrite || !(key in target)) {
+                target[key] = clone(source[key]);
+            }
+        }
+    }
+    return target;
+}
+function mergeAll(targetAndSources, overwrite) {
+    var result = targetAndSources[0];
+    for (var i = 1, len = targetAndSources.length; i < len; i++) {
+        result = merge(result, targetAndSources[i], overwrite);
+    }
+    return result;
+}
+function extend(target, source) {
+    if (Object.assign) {
+        Object.assign(target, source);
+    }
+    else {
+        for (var key in source) {
+            if (source.hasOwnProperty(key)) {
+                target[key] = source[key];
+            }
+        }
+    }
+    return target;
+}
+function defaults(target, source, overlay) {
+    var keysArr = keys(source);
+    for (var i = 0; i < keysArr.length; i++) {
+        var key = keysArr[i];
+        if ((overlay ? source[key] != null : target[key] == null)) {
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+var createCanvas = function () {
+    return methods.createCanvas();
+};
+methods.createCanvas = function () {
+    return document.createElement('canvas');
+};
+function indexOf(array, value) {
+    if (array) {
+        if (array.indexOf) {
+            return array.indexOf(value);
+        }
+        for (var i = 0, len = array.length; i < len; i++) {
+            if (array[i] === value) {
+                return i;
+            }
+        }
+    }
+    return -1;
+}
+function inherits(clazz, baseClazz) {
+    var clazzPrototype = clazz.prototype;
+    function F() { }
+    F.prototype = baseClazz.prototype;
+    clazz.prototype = new F();
+    for (var prop in clazzPrototype) {
+        if (clazzPrototype.hasOwnProperty(prop)) {
+            clazz.prototype[prop] = clazzPrototype[prop];
+        }
+    }
+    clazz.prototype.constructor = clazz;
+    clazz.superClass = baseClazz;
+}
+function mixin(target, source, override) {
+    target = 'prototype' in target ? target.prototype : target;
+    source = 'prototype' in source ? source.prototype : source;
+    if (Object.getOwnPropertyNames) {
+        var keyList = Object.getOwnPropertyNames(source);
+        for (var i = 0; i < keyList.length; i++) {
+            var key = keyList[i];
+            if (key !== 'constructor') {
+                if ((override ? source[key] != null : target[key] == null)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+    }
+    else {
+        defaults(target, source, override);
+    }
+}
+function isArrayLike(data) {
+    if (!data) {
+        return false;
+    }
+    if (typeof data === 'string') {
+        return false;
+    }
+    return typeof data.length === 'number';
+}
+function each(arr, cb, context) {
+    if (!(arr && cb)) {
+        return;
+    }
+    if (arr.forEach && arr.forEach === nativeForEach) {
+        arr.forEach(cb, context);
+    }
+    else if (arr.length === +arr.length) {
+        for (var i = 0, len = arr.length; i < len; i++) {
+            cb.call(context, arr[i], i, arr);
+        }
+    }
+    else {
+        for (var key in arr) {
+            if (arr.hasOwnProperty(key)) {
+                cb.call(context, arr[key], key, arr);
+            }
+        }
+    }
+}
+function map(arr, cb, context) {
+    if (!arr) {
+        return [];
+    }
+    if (!cb) {
+        return slice(arr);
+    }
+    if (arr.map && arr.map === nativeMap) {
+        return arr.map(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = arr.length; i < len; i++) {
+            result.push(cb.call(context, arr[i], i, arr));
+        }
+        return result;
+    }
+}
+function reduce(arr, cb, memo, context) {
+    if (!(arr && cb)) {
+        return;
+    }
+    for (var i = 0, len = arr.length; i < len; i++) {
+        memo = cb.call(context, memo, arr[i], i, arr);
+    }
+    return memo;
+}
+function filter(arr, cb, context) {
+    if (!arr) {
+        return [];
+    }
+    if (!cb) {
+        return slice(arr);
+    }
+    if (arr.filter && arr.filter === nativeFilter) {
+        return arr.filter(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = arr.length; i < len; i++) {
+            if (cb.call(context, arr[i], i, arr)) {
+                result.push(arr[i]);
+            }
+        }
+        return result;
+    }
+}
+function find(arr, cb, context) {
+    if (!(arr && cb)) {
+        return;
+    }
+    for (var i = 0, len = arr.length; i < len; i++) {
+        if (cb.call(context, arr[i], i, arr)) {
+            return arr[i];
+        }
+    }
+}
+function keys(obj) {
+    if (!obj) {
+        return [];
+    }
+    if (Object.keys) {
+        return Object.keys(obj);
+    }
+    var keyList = [];
+    for (var key in obj) {
+        if (obj.hasOwnProperty(key)) {
+            keyList.push(key);
+        }
+    }
+    return keyList;
+}
+function bindPolyfill(func, context) {
+    var args = [];
+    for (var _i = 2; _i < arguments.length; _i++) {
+        args[_i - 2] = arguments[_i];
+    }
+    return function () {
+        return func.apply(context, args.concat(nativeSlice.call(arguments)));
+    };
+}
+var bind = (protoFunction && isFunction(protoFunction.bind))
+    ? protoFunction.call.bind(protoFunction.bind)
+    : bindPolyfill;
+function curry(func) {
+    var args = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        args[_i - 1] = arguments[_i];
+    }
+    return function () {
+        return func.apply(this, args.concat(nativeSlice.call(arguments)));
+    };
+}
+
+function isArray(value) {
+    if (Array.isArray) {
+        return Array.isArray(value);
+    }
+    return objToString.call(value) === '[object Array]';
+}
+function isFunction(value) {
+    return typeof value === 'function';
+}
+function isString(value) {
+    return typeof value === 'string';
+}
+function isStringSafe(value) {
+    return objToString.call(value) === '[object String]';
+}
+function isNumber(value) {
+    return typeof value === 'number';
+}
+function isObject(value) {
+    var type = typeof value;
+    return type === 'function' || (!!value && type === 'object');
+}
+function isBuiltInObject(value) {
+    return !!BUILTIN_OBJECT[objToString.call(value)];
+}
+function isTypedArray(value) {
+    return !!TYPED_ARRAY[objToString.call(value)];
+}
+function isDom(value) {
+    return typeof value === 'object'
+        && typeof value.nodeType === 'number'
+        && typeof value.ownerDocument === 'object';
+}
+function isGradientObject(value) {
+    return value.colorStops != null;
+}
+function isPatternObject(value) {
+    return value.image != null;
+}
+function isRegExp(value) {
+    return objToString.call(value) === '[object RegExp]';
+}
+function eqNaN(value) {
+    return value !== value;
+}
+function retrieve() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+    }
+    for (var i = 0, len = args.length; i < len; i++) {
+        if (args[i] != null) {
+            return args[i];
+        }
+    }
+}
+function retrieve2(value0, value1) {
+    return value0 != null
+        ? value0
+        : value1;
+}
+function retrieve3(value0, value1, value2) {
+    return value0 != null
+        ? value0
+        : value1 != null
+            ? value1
+            : value2;
+}
+function slice(arr) {
+    var args = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        args[_i - 1] = arguments[_i];
+    }
+    return nativeSlice.apply(arr, args);
+}
+function normalizeCssArray(val) {
+    if (typeof (val) === 'number') {
+        return [val, val, val, val];
+    }
+    var len = val.length;
+    if (len === 2) {
+        return [val[0], val[1], val[0], val[1]];
+    }
+    else if (len === 3) {
+        return [val[0], val[1], val[2], val[1]];
+    }
+    return val;
+}
+function assert(condition, message) {
+    if (!condition) {
+        throw new Error(message);
+    }
+}
+function trim(str) {
+    if (str == null) {
+        return null;
+    }
+    else if (typeof str.trim === 'function') {
+        return str.trim();
+    }
+    else {
+        return str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
+    }
+}
+var primitiveKey = '__ec_primitive__';
+function setAsPrimitive(obj) {
+    obj[primitiveKey] = true;
+}
+function isPrimitive(obj) {
+    return obj[primitiveKey];
+}
+var HashMap = (function () {
+    function HashMap(obj) {
+        this.data = {};
+        var isArr = isArray(obj);
+        this.data = {};
+        var thisMap = this;
+        (obj instanceof HashMap)
+            ? obj.each(visit)
+            : (obj && each(obj, visit));
+        function visit(value, key) {
+            isArr ? thisMap.set(value, key) : thisMap.set(key, value);
+        }
+    }
+    HashMap.prototype.get = function (key) {
+        return this.data.hasOwnProperty(key) ? this.data[key] : null;
+    };
+    HashMap.prototype.set = function (key, value) {
+        return (this.data[key] = value);
+    };
+    HashMap.prototype.each = function (cb, context) {
+        for (var key in this.data) {
+            if (this.data.hasOwnProperty(key)) {
+                cb.call(context, this.data[key], key);
+            }
+        }
+    };
+    HashMap.prototype.keys = function () {
+        return keys(this.data);
+    };
+    HashMap.prototype.removeKey = function (key) {
+        delete this.data[key];
+    };
+    return HashMap;
+}());
+
+function createHashMap(obj) {
+    return new HashMap(obj);
+}
+function concatArray(a, b) {
+    var newArray = new a.constructor(a.length + b.length);
+    for (var i = 0; i < a.length; i++) {
+        newArray[i] = a[i];
+    }
+    var offset = a.length;
+    for (var i = 0; i < b.length; i++) {
+        newArray[i + offset] = b[i];
+    }
+    return newArray;
+}
+function createObject(proto, properties) {
+    var obj;
+    if (Object.create) {
+        obj = Object.create(proto);
+    }
+    else {
+        var StyleCtor = function () { };
+        StyleCtor.prototype = proto;
+        obj = new StyleCtor();
+    }
+    if (properties) {
+        extend(obj, properties);
+    }
+    return obj;
+}
+function hasOwn(own, prop) {
+    return own.hasOwnProperty(prop);
+}
+function noop() { }
+
+;// CONCATENATED MODULE: ./node_modules/echarts/lib/util/number.js
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied.  See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
+
+/**
+ * AUTO-GENERATED FILE. DO NOT MODIFY.
+ */
+
+
+var RADIAN_EPSILON = 1e-4;
+
+function _trim(str) {
+  return str.replace(/^\s+|\s+$/g, '');
+}
+
+function linearMap(val, domain, range, clamp) {
+  var subDomain = domain[1] - domain[0];
+  var subRange = range[1] - range[0];
+
+  if (subDomain === 0) {
+    return subRange === 0 ? range[0] : (range[0] + range[1]) / 2;
+  }
+
+  if (clamp) {
+    if (subDomain > 0) {
+      if (val <= domain[0]) {
+        return range[0];
+      } else if (val >= domain[1]) {
+        return range[1];
+      }
+    } else {
+      if (val >= domain[0]) {
+        return range[0];
+      } else if (val <= domain[1]) {
+        return range[1];
+      }
+    }
+  } else {
+    if (val === domain[0]) {
+      return range[0];
+    }
+
+    if (val === domain[1]) {
+      return range[1];
+    }
+  }
+
+  return (val - domain[0]) / subDomain * subRange + range[0];
+}
+function parsePercent(percent, all) {
+  switch (percent) {
+    case 'center':
+    case 'middle':
+      percent = '50%';
+      break;
+
+    case 'left':
+    case 'top':
+      percent = '0%';
+      break;
+
+    case 'right':
+    case 'bottom':
+      percent = '100%';
+      break;
+  }
+
+  if (typeof percent === 'string') {
+    if (_trim(percent).match(/%$/)) {
+      return parseFloat(percent) / 100 * all;
+    }
+
+    return parseFloat(percent);
+  }
+
+  return percent == null ? NaN : +percent;
+}
+function round(x, precision, returnStr) {
+  if (precision == null) {
+    precision = 10;
+  }
+
+  precision = Math.min(Math.max(0, precision), 20);
+  x = (+x).toFixed(precision);
+  return returnStr ? x : +x;
+}
+function asc(arr) {
+  arr.sort(function (a, b) {
+    return a - b;
+  });
+  return arr;
+}
+function getPrecision(val) {
+  val = +val;
+
+  if (isNaN(val)) {
+    return 0;
+  }
+
+  var e = 1;
+  var count = 0;
+
+  while (Math.round(val * e) / e !== val) {
+    e *= 10;
+    count++;
+  }
+
+  return count;
+}
+function getPrecisionSafe(val) {
+  var str = val.toString();
+  var eIndex = str.indexOf('e');
+
+  if (eIndex > 0) {
+    var precision = +str.slice(eIndex + 1);
+    return precision < 0 ? -precision : 0;
+  } else {
+    var dotIndex = str.indexOf('.');
+    return dotIndex < 0 ? 0 : str.length - 1 - dotIndex;
+  }
+}
+function getPixelPrecision(dataExtent, pixelExtent) {
+  var log = Math.log;
+  var LN10 = Math.LN10;
+  var dataQuantity = Math.floor(log(dataExtent[1] - dataExtent[0]) / LN10);
+  var sizeQuantity = Math.round(log(Math.abs(pixelExtent[1] - pixelExtent[0])) / LN10);
+  var precision = Math.min(Math.max(-dataQuantity + sizeQuantity, 0), 20);
+  return !isFinite(precision) ? 20 : precision;
+}
+function getPercentWithPrecision(valueList, idx, precision) {
+  if (!valueList[idx]) {
+    return 0;
+  }
+
+  var sum = reduce(valueList, function (acc, val) {
+    return acc + (isNaN(val) ? 0 : val);
+  }, 0);
+
+  if (sum === 0) {
+    return 0;
+  }
+
+  var digits = Math.pow(10, precision);
+  var votesPerQuota = map(valueList, function (val) {
+    return (isNaN(val) ? 0 : val) / sum * digits * 100;
+  });
+  var targetSeats = digits * 100;
+  var seats = map(votesPerQuota, function (votes) {
+    return Math.floor(votes);
+  });
+  var currentSum = reduce(seats, function (acc, val) {
+    return acc + val;
+  }, 0);
+  var remainder = map(votesPerQuota, function (votes, idx) {
+    return votes - seats[idx];
+  });
+
+  while (currentSum < targetSeats) {
+    var max = Number.NEGATIVE_INFINITY;
+    var maxId = null;
+
+    for (var i = 0, len = remainder.length; i < len; ++i) {
+      if (remainder[i] > max) {
+        max = remainder[i];
+        maxId = i;
+      }
+    }
+
+    ++seats[maxId];
+    remainder[maxId] = 0;
+    ++currentSum;
+  }
+
+  return seats[idx] / digits;
+}
+var MAX_SAFE_INTEGER = 9007199254740991;
+function remRadian(radian) {
+  var pi2 = Math.PI * 2;
+  return (radian % pi2 + pi2) % pi2;
+}
+function isRadianAroundZero(val) {
+  return val > -RADIAN_EPSILON && val < RADIAN_EPSILON;
+}
+var TIME_REG = /^(?:(\d{4})(?:[-\/](\d{1,2})(?:[-\/](\d{1,2})(?:[T ](\d{1,2})(?::(\d{1,2})(?::(\d{1,2})(?:[.,](\d+))?)?)?(Z|[\+\-]\d\d:?\d\d)?)?)?)?)?$/;
+function parseDate(value) {
+  if (value instanceof Date) {
+    return value;
+  } else if (typeof value === 'string') {
+    var match = TIME_REG.exec(value);
+
+    if (!match) {
+      return new Date(NaN);
+    }
+
+    if (!match[8]) {
+      return new Date(+match[1], +(match[2] || 1) - 1, +match[3] || 1, +match[4] || 0, +(match[5] || 0), +match[6] || 0, +match[7] || 0);
+    } else {
+      var hour = +match[4] || 0;
+
+      if (match[8].toUpperCase() !== 'Z') {
+        hour -= +match[8].slice(0, 3);
+      }
+
+      return new Date(Date.UTC(+match[1], +(match[2] || 1) - 1, +match[3] || 1, hour, +(match[5] || 0), +match[6] || 0, +match[7] || 0));
+    }
+  } else if (value == null) {
+    return new Date(NaN);
+  }
+
+  return new Date(Math.round(value));
+}
+function quantity(val) {
+  return Math.pow(10, quantityExponent(val));
+}
+function quantityExponent(val) {
+  if (val === 0) {
+    return 0;
+  }
+
+  var exp = Math.floor(Math.log(val) / Math.LN10);
+
+  if (val / Math.pow(10, exp) >= 10) {
+    exp++;
+  }
+
+  return exp;
+}
+function nice(val, round) {
+  var exponent = quantityExponent(val);
+  var exp10 = Math.pow(10, exponent);
+  var f = val / exp10;
+  var nf;
+
+  if (round) {
+    if (f < 1.5) {
+      nf = 1;
+    } else if (f < 2.5) {
+      nf = 2;
+    } else if (f < 4) {
+      nf = 3;
+    } else if (f < 7) {
+      nf = 5;
+    } else {
+      nf = 10;
+    }
+  } else {
+    if (f < 1) {
+      nf = 1;
+    } else if (f < 2) {
+      nf = 2;
+    } else if (f < 3) {
+      nf = 3;
+    } else if (f < 5) {
+      nf = 5;
+    } else {
+      nf = 10;
+    }
+  }
+
+  val = nf * exp10;
+  return exponent >= -20 ? +val.toFixed(exponent < 0 ? -exponent : 0) : val;
+}
+function quantile(ascArr, p) {
+  var H = (ascArr.length - 1) * p + 1;
+  var h = Math.floor(H);
+  var v = +ascArr[h - 1];
+  var e = H - h;
+  return e ? v + e * (ascArr[h] - v) : v;
+}
+function reformIntervals(list) {
+  list.sort(function (a, b) {
+    return littleThan(a, b, 0) ? -1 : 1;
+  });
+  var curr = -Infinity;
+  var currClose = 1;
+
+  for (var i = 0; i < list.length;) {
+    var interval = list[i].interval;
+    var close_1 = list[i].close;
+
+    for (var lg = 0; lg < 2; lg++) {
+      if (interval[lg] <= curr) {
+        interval[lg] = curr;
+        close_1[lg] = !lg ? 1 - currClose : 1;
+      }
+
+      curr = interval[lg];
+      currClose = close_1[lg];
+    }
+
+    if (interval[0] === interval[1] && close_1[0] * close_1[1] !== 1) {
+      list.splice(i, 1);
+    } else {
+      i++;
+    }
+  }
+
+  return list;
+
+  function littleThan(a, b, lg) {
+    return a.interval[lg] < b.interval[lg] || a.interval[lg] === b.interval[lg] && (a.close[lg] - b.close[lg] === (!lg ? 1 : -1) || !lg && littleThan(a, b, 1));
+  }
+}
+function numericToNumber(val) {
+  var valFloat = parseFloat(val);
+  return valFloat == val && (valFloat !== 0 || typeof val !== 'string' || val.indexOf('x') <= 0) ? valFloat : NaN;
+}
+function isNumeric(val) {
+  return !isNaN(numericToNumber(val));
+}
+function getRandomIdBase() {
+  return Math.round(Math.random() * 9);
+}
+function getGreatestCommonDividor(a, b) {
+  if (b === 0) {
+    return a;
+  }
+
+  return getGreatestCommonDividor(b, a % b);
+}
+function getLeastCommonMultiple(a, b) {
+  if (a == null) {
+    return b;
+  }
+
+  if (b == null) {
+    return a;
+  }
+
+  return a * b / getGreatestCommonDividor(a, b);
+}
+;// CONCATENATED MODULE: ./src/liquidFillShape.js
+
+
+/* harmony default export */ const liquidFillShape = (external_echarts_.graphic.extendShape({
+    type: 'ec-liquid-fill',
+
+    shape: {
+        waveLength: 0,
+        radius: 0,
+        radiusY: 0,
+        cx: 0,
+        cy: 0,
+        waterLevel: 0,
+        amplitude: 0,
+        phase: 0,
+        inverse: false
+    },
+
+    buildPath: function (ctx, shape) {
+        if (shape.radiusY == null) {
+            shape.radiusY = shape.radius;
+        }
+
+        /**
+         * We define a sine wave having 4 waves, and make sure at least 8 curves
+         * is drawn. Otherwise, it may cause blank area for some waves when
+         * wave length is large enough.
+         */
+        var curves = Math.max(
+            Math.ceil(2 * shape.radius / shape.waveLength * 4) * 2,
+            8
+        );
+
+        // map phase to [-Math.PI * 2, 0]
+        while (shape.phase < -Math.PI * 2) {
+            shape.phase += Math.PI * 2;
+        }
+        while (shape.phase > 0) {
+            shape.phase -= Math.PI * 2;
+        }
+        var phase = shape.phase / Math.PI / 2 * shape.waveLength;
+
+        var left = shape.cx - shape.radius + phase - shape.radius * 2;
+
+        /**
+         * top-left corner as start point
+         *
+         * draws this point
+         *  |
+         * \|/
+         *  ~~~~~~~~
+         *  |      |
+         *  +------+
+         */
+        ctx.moveTo(left, shape.waterLevel);
+
+        /**
+         * top wave
+         *
+         * ~~~~~~~~ <- draws this sine wave
+         * |      |
+         * +------+
+         */
+        var waveRight = 0;
+        for (var c = 0; c < curves; ++c) {
+            var stage = c % 4;
+            var pos = getWaterPositions(c * shape.waveLength / 4, stage,
+                shape.waveLength, shape.amplitude);
+            ctx.bezierCurveTo(pos[0][0] + left, -pos[0][1] + shape.waterLevel,
+                pos[1][0] + left, -pos[1][1] + shape.waterLevel,
+                pos[2][0] + left, -pos[2][1] + shape.waterLevel);
+
+            if (c === curves - 1) {
+                waveRight = pos[2][0];
+            }
+        }
+
+        if (shape.inverse) {
+            /**
+             * top-right corner
+             *                  2. draws this line
+             *                          |
+             *                       +------+
+             * 3. draws this line -> |      | <- 1. draws this line
+             *                       ~~~~~~~~
+             */
+            ctx.lineTo(waveRight + left, shape.cy - shape.radiusY);
+            ctx.lineTo(left, shape.cy - shape.radiusY);
+            ctx.lineTo(left, shape.waterLevel);
+        }
+        else {
+            /**
+             * top-right corner
+             *
+             *                       ~~~~~~~~
+             * 3. draws this line -> |      | <- 1. draws this line
+             *                       +------+
+             *                          ^
+             *                          |
+             *                  2. draws this line
+             */
+            ctx.lineTo(waveRight + left, shape.cy + shape.radiusY);
+            ctx.lineTo(left, shape.cy + shape.radiusY);
+            ctx.lineTo(left, shape.waterLevel);
+        }
+
+        ctx.closePath();
+    }
+}));
+
+
+
+/**
+ * Using Bezier curves to fit sine wave.
+ * There is 4 control points for each curve of wave,
+ * which is at 1/4 wave length of the sine wave.
+ *
+ * The control points for a wave from (a) to (d) are a-b-c-d:
+ *          c *----* d
+ *     b *
+ *       |
+ * ... a * ..................
+ *
+ * whose positions are a: (0, 0), b: (0.5, 0.5), c: (1, 1), d: (PI / 2, 1)
+ *
+ * @param {number} x          x position of the left-most point (a)
+ * @param {number} stage      0-3, stating which part of the wave it is
+ * @param {number} waveLength wave length of the sine wave
+ * @param {number} amplitude  wave amplitude
+ */
+function getWaterPositions(x, stage, waveLength, amplitude) {
+    if (stage === 0) {
+        return [
+            [x + 1 / 2 * waveLength / Math.PI / 2, amplitude / 2],
+            [x + 1 / 2 * waveLength / Math.PI,     amplitude],
+            [x + waveLength / 4,                   amplitude]
+        ];
+    }
+    else if (stage === 1) {
+        return [
+            [x + 1 / 2 * waveLength / Math.PI / 2 * (Math.PI - 2),
+            amplitude],
+            [x + 1 / 2 * waveLength / Math.PI / 2 * (Math.PI - 1),
+            amplitude / 2],
+            [x + waveLength / 4,                   0]
+        ]
+    }
+    else if (stage === 2) {
+        return [
+            [x + 1 / 2 * waveLength / Math.PI / 2, -amplitude / 2],
+            [x + 1 / 2 * waveLength / Math.PI,     -amplitude],
+            [x + waveLength / 4,                   -amplitude]
+        ]
+    }
+    else {
+        return [
+            [x + 1 / 2 * waveLength / Math.PI / 2 * (Math.PI - 2),
+            -amplitude],
+            [x + 1 / 2 * waveLength / Math.PI / 2 * (Math.PI - 1),
+            -amplitude / 2],
+            [x + waveLength / 4,                   0]
+        ]
+    }
+}
+
+;// CONCATENATED MODULE: ./src/liquidFillView.js
+
+
+
+
+var liquidFillView_parsePercent = parsePercent;
+
+function isPathSymbol(symbol) {
+    return symbol && symbol.indexOf('path://') === 0
+}
+
+external_echarts_.extendChartView({
+
+    type: 'liquidFill',
+
+    render: function (seriesModel, ecModel, api) {
+        var self = this;
+        var group = this.group;
+        group.removeAll();
+
+        var data = seriesModel.getData();
+
+        var itemModel = data.getItemModel(0);
+
+        var center = itemModel.get('center');
+        var radius = itemModel.get('radius');
+
+        var width = api.getWidth();
+        var height = api.getHeight();
+        var size = Math.min(width, height);
+        // itemStyle
+        var outlineDistance = 0;
+        var outlineBorderWidth = 0;
+        var showOutline = seriesModel.get('outline.show');
+
+        if (showOutline) {
+            outlineDistance = seriesModel.get('outline.borderDistance');
+            outlineBorderWidth = liquidFillView_parsePercent(
+                seriesModel.get('outline.itemStyle.borderWidth'), size
+            );
+        }
+
+        var cx = liquidFillView_parsePercent(center[0], width);
+        var cy = liquidFillView_parsePercent(center[1], height);
+
+        var outterRadius;
+        var innerRadius;
+        var paddingRadius;
+
+        var isFillContainer = false;
+
+        var symbol = seriesModel.get('shape');
+        if (symbol === 'container') {
+            // a shape that fully fills the container
+            isFillContainer = true;
+
+            outterRadius = [
+                width / 2,
+                height / 2
+            ];
+            innerRadius = [
+                outterRadius[0] - outlineBorderWidth / 2,
+                outterRadius[1] - outlineBorderWidth / 2
+            ];
+            paddingRadius = [
+                liquidFillView_parsePercent(outlineDistance, width),
+                liquidFillView_parsePercent(outlineDistance, height)
+            ];
+
+            radius = [
+                Math.max(innerRadius[0] - paddingRadius[0], 0),
+                Math.max(innerRadius[1] - paddingRadius[1], 0)
+            ];
+        }
+        else {
+            outterRadius = liquidFillView_parsePercent(radius, size) / 2;
+            innerRadius = outterRadius - outlineBorderWidth / 2;
+            paddingRadius = liquidFillView_parsePercent(outlineDistance, size);
+
+            radius = Math.max(innerRadius - paddingRadius, 0);
+        }
+
+        if (showOutline) {
+            var outline = getOutline();
+            outline.style.lineWidth = outlineBorderWidth;
+            group.add(getOutline());
+        }
+
+        var left = isFillContainer ? 0 : cx - radius;
+        var top = isFillContainer ? 0 : cy - radius;
+
+        var wavePath = null;
+
+        group.add(getBackground());
+
+        // each data item for a wave
+        var oldData = this._data;
+        var waves = [];
+        data.diff(oldData)
+            .add(function (idx) {
+                var wave = getWave(idx, false);
+
+                var waterLevel = wave.shape.waterLevel;
+                wave.shape.waterLevel = isFillContainer ? height / 2 : radius;
+                external_echarts_.graphic.initProps(wave, {
+                    shape: {
+                        waterLevel: waterLevel
+                    }
+                }, seriesModel);
+
+                wave.z2 = 2;
+                setWaveAnimation(idx, wave, null);
+
+                group.add(wave);
+                data.setItemGraphicEl(idx, wave);
+                waves.push(wave);
+            })
+            .update(function (newIdx, oldIdx) {
+                var waveElement = oldData.getItemGraphicEl(oldIdx);
+
+                // new wave is used to calculate position, but not added
+                var newWave = getWave(newIdx, false, waveElement);
+
+                // changes with animation
+                var shape = {};
+                var shapeAttrs = ['amplitude', 'cx', 'cy', 'phase', 'radius', 'radiusY', 'waterLevel', 'waveLength'];
+                for (var i = 0; i < shapeAttrs.length; ++i) {
+                    var attr = shapeAttrs[i];
+                    if (newWave.shape.hasOwnProperty(attr)) {
+                        shape[attr] = newWave.shape[attr];
+                    }
+                }
+
+                var style = {};
+                var styleAttrs = ['fill', 'opacity', 'shadowBlur', 'shadowColor'];
+                for (var i = 0; i < styleAttrs.length; ++i) {
+                    var attr = styleAttrs[i];
+                    if (newWave.style.hasOwnProperty(attr)) {
+                        style[attr] = newWave.style[attr];
+                    }
+                }
+
+                if (isFillContainer) {
+                    shape.radiusY = height / 2;
+                }
+
+                // changes with animation
+                external_echarts_.graphic.updateProps(waveElement, {
+                    shape: shape,
+                    x: newWave.x,
+                    y: newWave.y
+                }, seriesModel);
+
+                if (seriesModel.isUniversalTransitionEnabled && seriesModel.isUniversalTransitionEnabled()) {
+                    external_echarts_.graphic.updateProps(waveElement, {
+                        style: style
+                    }, seriesModel);
+                }
+                else {
+                    waveElement.useStyle(style);
+                }
+
+                // instant changes
+                var oldWaveClipPath = waveElement.getClipPath();
+                var newWaveClipPath = newWave.getClipPath();
+
+                waveElement.setClipPath(newWave.getClipPath());
+                waveElement.shape.inverse = newWave.inverse;
+
+                if (oldWaveClipPath && newWaveClipPath
+                    && self._shape === symbol
+                    // TODO use zrender morphing to apply complex symbol animation.
+                    && !isPathSymbol(symbol)
+                ) {
+                    // Can be animated.
+                    external_echarts_.graphic.updateProps(newWaveClipPath, {
+                        shape: oldWaveClipPath.shape
+                    }, seriesModel, { isFrom: true });
+                }
+
+                setWaveAnimation(newIdx, waveElement, waveElement);
+                group.add(waveElement);
+                data.setItemGraphicEl(newIdx, waveElement);
+                waves.push(waveElement);
+            })
+            .remove(function (idx) {
+                var wave = oldData.getItemGraphicEl(idx);
+                group.remove(wave);
+            })
+            .execute();
+
+        if (itemModel.get('label.show')) {
+            group.add(getText(waves));
+        }
+
+        this._shape = symbol;
+        this._data = data;
+
+        /**
+         * Get path for outline, background and clipping
+         *
+         * @param {number} r outter radius of shape
+         * @param {boolean|undefined} isForClipping if the shape is used
+         *                                          for clipping
+         */
+        function getPath(r, isForClipping) {
+            if (symbol) {
+                // customed symbol path
+                if (isPathSymbol(symbol)) {
+                    var path = external_echarts_.graphic.makePath(symbol.slice(7), {});
+                    var bouding = path.getBoundingRect();
+                    var w = bouding.width;
+                    var h = bouding.height;
+                    if (w > h) {
+                        h = r * 2 / w * h;
+                        w = r * 2;
+                    }
+                    else {
+                        w = r * 2 / h * w;
+                        h = r * 2;
+                    }
+
+                    var left = isForClipping ? 0 : cx - w / 2;
+                    var top = isForClipping ? 0 : cy - h / 2;
+                    path = external_echarts_.graphic.makePath(
+                        symbol.slice(7),
+                        {},
+                        new external_echarts_.graphic.BoundingRect(left, top, w, h)
+                    );
+                    if (isForClipping) {
+                        path.x = -w / 2;
+                        path.y = -h / 2;
+                    }
+                    return path;
+                }
+                else if (isFillContainer) {
+                    // fully fill the container
+                    var x = isForClipping ? -r[0] : cx - r[0];
+                    var y = isForClipping ? -r[1] : cy - r[1];
+                    return external_echarts_.helper.createSymbol(
+                        'rect', x, y, r[0] * 2, r[1] * 2
+                    );
+                }
+                else {
+                    var x = isForClipping ? -r : cx - r;
+                    var y = isForClipping ? -r : cy - r;
+                    if (symbol === 'pin') {
+                        y += r;
+                    }
+                    else if (symbol === 'arrow') {
+                        y -= r;
+                    }
+                    return external_echarts_.helper.createSymbol(symbol, x, y, r * 2, r * 2);
+                }
+            }
+
+            return new external_echarts_.graphic.Circle({
+                shape: {
+                    cx: isForClipping ? 0 : cx,
+                    cy: isForClipping ? 0 : cy,
+                    r: r
+                }
+            });
+        }
+        /**
+         * Create outline
+         */
+        function getOutline() {
+            var outlinePath = getPath(outterRadius);
+            outlinePath.style.fill = null;
+
+            outlinePath.setStyle(seriesModel.getModel('outline.itemStyle')
+                .getItemStyle());
+
+            return outlinePath;
+        }
+
+        /**
+         * Create background
+         */
+        function getBackground() {
+            // Seperate stroke and fill, so we can use stroke to cover the alias of clipping.
+            var strokePath = getPath(radius);
+            strokePath.setStyle(seriesModel.getModel('backgroundStyle')
+                .getItemStyle());
+            strokePath.style.fill = null;
+
+            // Stroke is front of wave
+            strokePath.z2 = 5;
+
+            var fillPath = getPath(radius);
+            fillPath.setStyle(seriesModel.getModel('backgroundStyle')
+                .getItemStyle());
+            fillPath.style.stroke = null;
+
+            var group = new external_echarts_.graphic.Group();
+            group.add(strokePath);
+            group.add(fillPath);
+
+            return group;
+        }
+
+        /**
+         * wave shape
+         */
+        function getWave(idx, isInverse, oldWave) {
+            var radiusX = isFillContainer ? radius[0] : radius;
+            var radiusY = isFillContainer ? height / 2 : radius;
+
+            var itemModel = data.getItemModel(idx);
+            var itemStyleModel = itemModel.getModel('itemStyle');
+            var phase = itemModel.get('phase');
+            var amplitude = liquidFillView_parsePercent(itemModel.get('amplitude'),
+                radiusY * 2);
+            var waveLength = liquidFillView_parsePercent(itemModel.get('waveLength'),
+                radiusX * 2);
+
+            var value = data.get('value', idx);
+            var waterLevel = radiusY - value * radiusY * 2;
+            phase = oldWave ? oldWave.shape.phase
+                : (phase === 'auto' ? idx * Math.PI / 4 : phase);
+            var normalStyle = itemStyleModel.getItemStyle();
+            if (!normalStyle.fill) {
+                var seriesColor = seriesModel.get('color');
+                var id = idx % seriesColor.length;
+                normalStyle.fill = seriesColor[id];
+            }
+
+            var x = radiusX * 2;
+            var wave = new liquidFillShape({
+                shape: {
+                    waveLength: waveLength,
+                    radius: radiusX,
+                    radiusY: radiusY,
+                    cx: x,
+                    cy: 0,
+                    waterLevel: waterLevel,
+                    amplitude: amplitude,
+                    phase: phase,
+                    inverse: isInverse
+                },
+                style: normalStyle,
+                x: cx,
+                y: cy,
+            });
+            wave.shape._waterLevel = waterLevel;
+
+            var hoverStyle = itemModel.getModel('emphasis.itemStyle')
+                .getItemStyle();
+            hoverStyle.lineWidth = 0;
+
+            wave.ensureState('emphasis').style = hoverStyle;
+            external_echarts_.helper.enableHoverEmphasis(wave);
+
+            // clip out the part outside the circle
+            var clip = getPath(radius, true);
+            // set fill for clipPath, otherwise it will not trigger hover event
+            clip.setStyle({
+                fill: 'white'
+            });
+            wave.setClipPath(clip);
+
+            return wave;
+        }
+
+        function setWaveAnimation(idx, wave, oldWave) {
+            var itemModel = data.getItemModel(idx);
+
+            var maxSpeed = itemModel.get('period');
+            var direction = itemModel.get('direction');
+
+            var value = data.get('value', idx);
+
+            var phase = itemModel.get('phase');
+            phase = oldWave ? oldWave.shape.phase
+                : (phase === 'auto' ? idx * Math.PI / 4 : phase);
+
+            var defaultSpeed = function (maxSpeed) {
+                var cnt = data.count();
+                return cnt === 0 ? maxSpeed : maxSpeed *
+                    (0.2 + (cnt - idx) / cnt * 0.8);
+            };
+            var speed = 0;
+            if (maxSpeed === 'auto') {
+                speed = defaultSpeed(5000);
+            }
+            else {
+                speed = typeof maxSpeed === 'function'
+                    ? maxSpeed(value, idx) : maxSpeed;
+            }
+
+            // phase for moving left/right
+            var phaseOffset = 0;
+            if (direction === 'right' || direction == null) {
+                phaseOffset = Math.PI;
+            }
+            else if (direction === 'left') {
+                phaseOffset = -Math.PI;
+            }
+            else if (direction === 'none') {
+                phaseOffset = 0;
+            }
+            else {
+                console.error('Illegal direction value for liquid fill.');
+            }
+
+            // wave animation of moving left/right
+            if (direction !== 'none' && itemModel.get('waveAnimation')) {
+                wave
+                    .animate('shape', true)
+                    .when(0, {
+                        phase: phase
+                    })
+                    .when(speed / 2, {
+                        phase: phaseOffset + phase
+                    })
+                    .when(speed, {
+                        phase: phaseOffset * 2 + phase
+                    })
+                    .during(function () {
+                        if (wavePath) {
+                            wavePath.dirty(true);
+                        }
+                    })
+                    .start();
+            }
+        }
+
+        /**
+         * text on wave
+         */
+        function getText(waves) {
+            var labelModel = itemModel.getModel('label');
+
+            function formatLabel() {
+                var formatted = seriesModel.getFormattedLabel(0, 'normal');
+                var defaultVal = (data.get('value', 0) * 100);
+                var defaultLabel = data.getName(0) || seriesModel.name;
+                if (!isNaN(defaultVal)) {
+                    defaultLabel = defaultVal.toFixed(0) + '%';
+                }
+                return formatted == null ? defaultLabel : formatted;
+            }
+
+            var textRectOption = {
+                z2: 10,
+                shape: {
+                    x: left,
+                    y: top,
+                    width: (isFillContainer ? radius[0] : radius) * 2,
+                    height: (isFillContainer ? radius[1] : radius) * 2
+                },
+                style: {
+                    fill: 'transparent'
+                },
+                textConfig: {
+                    position: labelModel.get('position') || 'inside'
+                },
+                silent: true
+            };
+            var textOption = {
+                style: {
+                    text: formatLabel(),
+                    textAlign: labelModel.get('align'),
+                    textVerticalAlign: labelModel.get('baseline')
+                }
+            };
+            Object.assign(textOption.style, external_echarts_.helper.createTextStyle(labelModel));
+
+            var outsideTextRect = new external_echarts_.graphic.Rect(textRectOption);
+            var insideTextRect = new external_echarts_.graphic.Rect(textRectOption);
+            insideTextRect.disableLabelAnimation = true;
+            outsideTextRect.disableLabelAnimation = true;
+
+            var outsideText = new external_echarts_.graphic.Text(textOption);
+            var insideText = new external_echarts_.graphic.Text(textOption);
+            outsideTextRect.setTextContent(outsideText);
+
+            insideTextRect.setTextContent(insideText);
+            var insColor = labelModel.get('insideColor');
+            insideText.style.fill = insColor;
+
+            var group = new external_echarts_.graphic.Group();
+            group.add(outsideTextRect);
+            group.add(insideTextRect);
+
+            // clip out waves for insideText
+            var boundingCircle = getPath(radius, true);
+
+            wavePath = new external_echarts_.graphic.CompoundPath({
+                shape: {
+                    paths: waves
+                },
+                x: cx,
+                y: cy
+            });
+
+            wavePath.setClipPath(boundingCircle);
+            insideTextRect.setClipPath(wavePath);
+
+            return group;
+        }
+    },
+
+    dispose: function () {
+        // dispose nothing here
+    }
+});
+
+;// CONCATENATED MODULE: ./src/liquidFill.js
+
+
+;// CONCATENATED MODULE: ./index.js
+
+
+
+/***/ }),
+
+/***/ "echarts/lib/echarts":
+/*!**************************!*\
+  !*** external "echarts" ***!
+  \**************************/
+/***/ ((module) => {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_echarts_lib_echarts__;
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		if(__webpack_module_cache__[moduleId]) {
+/******/ 			return __webpack_module_cache__[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+/******/ 	// module exports must be returned from runtime so entry inlining is disabled
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__("./index.js");
+/******/ })()
+;
+});
+//# sourceMappingURL=echarts-liquidfill.js.map

+ 5 - 1
investmentNew/styles/index.css

@@ -306,7 +306,7 @@ a {
 }
 .center2 > div:nth-child(1) > div {
   margin-left: 10%;
-  background-size: 100% 100%;
+  background-size: 100% 100% !important;
   overflow: hidden;
   padding-left: 40%;
 }
@@ -333,6 +333,10 @@ a {
   opacity: 0.4;
   /* display: none; */
 }
+.center4>div>div{
+  width: 100%;
+  height: 100%;
+}
 .bgTooltip {
   overflow: hidden;
   padding: 10% 15% !important;