更改pie图和玫瑰图

echarts-screen/src/components/distribution.vue → echarts-screen/src/components/RoseCon.vue

@@ -5,14 +5,14 @@
 -->
 
 <template>
-  <div class="distribution-container"> 
+  <div class="RoseCon-container">
     <div class="chart" id="chart_right2"></div>
   </div>
 </template>
 
 <script>
 export default {
-  name: "distribution",
+  name: "RoseCon",
   data() {
     return {
       
@@ -165,27 +165,27 @@ export default {
             }
           },
           data: [{
-            value: 35,
-            name: '湖南'
+            value: 1173,
+            name: '香港'
           },{
-            value: 28,
-            name: '河北'
+            value: 131,
+            name: '台湾'
           },{
-            value: 23,
+            value: 108,
+            name: '上海'
+          },{
+            value: 41,
             name: '广东'
           },{
-            value: 18,
+            value: 36,
             name: '四川'
           },{
-            value: 13,
-            name: '浙江'
-          },{
-            value: 8,
-            name: '江苏'
+            value: 22,
+            name: '福建'
           },{
-            value: 5,
-            name: '湖北'
-          }]
+            value: 20,
+            name: '内蒙古'
+            }]
         }]
       }
 
@@ -202,7 +202,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.distribution-container {
+.RoseCon-container {
   .chart {
     height: 3rem;
   }

echarts-screen/src/components/business.vue

@@ -1,177 +0,0 @@
-<template>
-    <div class="business-container">
-        <div class="chart" id="chart_left1"></div>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: "business",
-        data() {
-            return {}
-        },
-        mounted() {
-            this.getEchartLeft1();
-        },
-        methods: {
-            getEchartLeft1() {
-                // 实例化对象
-                let myChart = echarts.init(document.getElementById('chart_left1'));
-                let charts = { // 按顺序排列从大到小
-                    cityList: ['美国', '印度', '巴西', '俄罗斯', '法国', '英国', '其他'],
-                    cityData: [18487519, 10094801, 7264221, 2906503, 2479151, 2073511, 34614833]
-                }
-
-                let top10CityList = charts.cityList;
-                let top10CityData = charts.cityData;
-                let color = ['rgba(14,109,236', 'rgba(255,91,6', 'rgba(100,255,249', 'rgba(248,195,248', 'rgba(110,234,19', 'rgba(255,168,17', 'rgba(218,111,227'];
-
-                let lineY = [];
-                for (let i = 0; i < charts.cityList.length; i++) {
-                    let x = i
-                    if (x > color.length - 1) {
-                        x = color.length - 1
-                    }
-                    let data = {
-                        name: charts.cityList[i],
-                        color: color[x] + ')',
-                        value: top10CityData[i],
-                        itemStyle: {
-                            normal: {
-                                show: true,
-                                color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
-                                    offset: 0,
-                                    color: color[x] + ', 0.3)'
-                                }, {
-                                    offset: 1,
-                                    color: color[x] + ', 1)'
-                                }], false),
-                                barBorderRadius: 10
-                            },
-                            emphasis: {
-                                shadowBlur: 15,
-                                shadowColor: 'rgba(0, 0, 0, 0.1)'
-                            }
-                        }
-                    }
-                    lineY.push(data)
-                }
-
-                // 指定配置和数据
-                let option = {
-                    color: color,
-                    tooltip: {
-                        trigger: 'item',
-                    },
-                    grid: {
-                        borderWidth: 0,
-                        top: '5%',
-                        left: '2%',
-                        right: '2%',
-                        bottom: '0%',
-                        containLabel: true
-                    },
-                    xAxis: [{
-                        type: 'value',
-                        axisTick: {
-                            show: false
-                        },
-                        axisLine: {
-                            show: false
-                        },
-                        splitLine: {
-                            show: false
-                        },
-                        axisLabel: {
-                            show: false
-                        }
-                    }],
-                    yAxis: [{
-                        type: 'category',
-                        inverse: true,
-                        axisTick: {
-                            show: false
-                        },
-                        axisLine: {
-                            show: false
-                        },
-                        axisLabel: {
-                            show: true,
-                            inside: false,
-                            textStyle: {
-                                color: '#b3ccf8',
-                                fontSize: 13
-                            },
-                        },
-                        data: top10CityList
-                    }, {
-                        type: 'category',
-                        axisLine: {
-                            show: false
-                        },
-                        axisTick: {
-                            show: false
-                        },
-                        axisLabel: {
-                            show: true,
-                            inside: false,
-                            textStyle: {
-                                color: '#b3ccf8',
-                                fontSize: 13
-                            },
-                            formatter: (val) => {
-                                return `${val}`
-                            }
-                        },
-                        splitArea: {
-                            show: false
-                        },
-                        splitLine: {
-                            show: false
-                        },
-                        data: top10CityData.reverse()
-                    }],
-                    series: [{
-                        name: '',
-                        type: 'bar',
-                        zlevel: 2,
-                        barWidth: '10px',
-                        data: lineY,
-                        animationDuration: 1500,
-                        label: {
-                            normal: {
-                                color: '#b3ccf8',
-                                show: false,
-                                position: [0, '-15px'],
-                                textStyle: {
-                                    fontSize: 13
-                                },
-                                formatter: (a, b) => {
-                                    return a.name;
-
-                                }
-                            }
-                        }
-                    }]
-                };
-
-                // 把配置给实例对象
-                myChart.setOption(option, true);
-                window.addEventListener('resize', () => {
-                    myChart.resize();
-                });
-            },
-        },
-        beforeDestroy() {
-
-        }
-    };
-</script>
-
-<style lang="scss" scoped>
-    .business-container {
-        .chart {
-            height: 3rem;
-        }
-    }
-</style>

echarts-screen/src/components/history.vue

@@ -1,171 +0,0 @@
-<!--
- 描述: 发展历程
- 作者: Jack Chen
- 日期: 2020-05-09
--->
-
-<template>
-  <div class="history-container">
-    <div class="tabs"> 
-      <ul class="tab-tilte">
-        <li v-for="(itemTit, index) in tabTitle" @mouseover="handleMouseOver(index)" @mouseout="handleMouseOut(index)" :class="{active: cur == index}">
-          {{ itemTit }}
-        </li>
-      </ul>
-      <div class="indicatorDots">
-        <span :class="{active: cur == i}" v-for="(v, i) in tabTitle" :key="i"></span>
-      </div>
-      <div class="tab-content">
-        <div v-for="(itemCon, index) in tabCon" v-show="cur == index">
-          <div v-for="(v, i) in itemCon" :key="i" class="content">
-            {{ v }}
-          </div>
-        </div>
-      </div>
-    </div>   
-  </div>
-</template>
-
-<script>
-export default {
-  name: "history",
-  data() {
-    return {
-      timer: null,
-      tabTitle: ['2015', '2016', '2017', '2018', '2019', '2020'],
-      tabCon: [
-        [
-          '2015.10，公司成立，正式布局区块链、大数据方向',
-          '2015.11，与国家超算吕梁云计算中心签订战略合作协议',
-          '2015.12，建设高性能计算服务平台，基于区块链技术打造文创基础云平台'
-        ],
-        [
-          '2016.03，公司提供的高性能计算服务得到中科院认可，就此达成合作',
-          '2016.07，与国家超算广州中心签订战略合作协议，启动区块链底层公链开发技术论证',
-          '2016.10，启动区块链底层公链开发，开拓数字资产管理业务',
-          '2016.11，与国家超级计算长沙中心签订战略合作协议'
-        ],
-        [
-          '2017.03，与国家级长沙经开区共建博士创新创业园',
-          '2017.07，开发GBI区块链资讯信息平台',
-          '2017.09，打造区块链信息服务平台，开拓区块链安全业务',
-          '2017.12，区块链底层公链测试链上线运行，启动链上DAPP开发'
-        ],
-        [
-          '2018.05，与长沙经开区共建区块链产业园，区块链底层公链上线运行',
-          '2018.08，公链分布式存储网络正式运行',
-          '2018.10，区块链安全技术检测中心正式运行，公链多侧链技术落地，链上应用上线',
-          '2018.12，被评为中国区块链百强企业'
-        ],
-        [
-          '2019.03，上线分布式存储系统UDFS，更新优壹号V2.0.0版，完成Ulord V2.0版白皮书全部规划',
-          '2019.07，文创版权公共服务平台优版权正式上线',
-          '2019.08，承担国家网信办区块链相关课题研究',
-        ],
-        [
-          '2020.03，完成分布式计算框架和贡献证明算法的设计和开发',
-          '2020.05，完成分布式计算资源动态调度和管理开发',
-          '2020.10，推出链云计算生态，完成计算平台和API接口开发，完成优壹号对计算Dapp支持'
-        ]
-      ],
-      cur: 0, //默认选中第一个tab
-    }
-  },
-  mounted() {
-    this.getTimer();
-  },
-  methods: {
-    getTimer() {
-      this.timer = setInterval(() => {
-        this.cur++;
-        if (this.cur == this.tabTitle.length) {
-          this.cur = 0;
-        }
-      }, 2000)
-    },
-    handleMouseOver(index) {
-      this.cur = index;
-      clearInterval(this.timer);
-    },
-    handleMouseOut(index) {
-      this.getTimer();
-    }
-  },
-  beforeDestroy() {
-    clearInterval(this.timer);
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.history-container {
-  margin: 0 0.125rem;
-  .tabs {
-    display: flex;
-    .tab-tilte {
-      li {
-        color: #fff;
-        background-color: rgba(36, 196, 255, 0.5);
-        text-align: center;
-        cursor: pointer;
-        width: 1.0rem;
-        height: 0.35rem;
-        line-height: 0.35rem;
-        margin-bottom: 0.175rem;
-        -webkit-border-radius: 5px;
-        -ms-border-radius: 5px;
-        -o-border-radius: 5px;
-        -moz-border-radius: 5px;
-        border-radius: 5px;
-        &.active{
-          background: linear-gradient(to right, #1b81bc, 20%, #24c4ff);
-          color: #fff;
-        }
-      }
-    }
-    .indicatorDots {
-      background-color: rgba(36, 196, 255, 0.5);
-      width: 1px;
-      height: 2.8rem;
-      margin: 0.0625rem 0 0 0.375rem;
-      span {
-        display: block;
-        height: 0.525rem;
-        margin-left: -0.0875rem;
-        &:after {
-          content: '';
-          display: block;
-          width: 0.125rem;
-          height: 0.125rem;
-          background: #ddd;
-          -webkit-border-radius: 50%;
-          -ms-border-radius: 50%;
-          -o-border-radius: 50%;
-          -moz-border-radius: 50%;
-          border-radius: 50%;
-          border: 2px solid #1b81bc;
-        }
-        &.active {
-          &:after {
-            background: #24c4ff;
-            -webkit-box-shadow: 0 0 0.125rem #1b81bc;
-            box-shadow: 0 0 0.125rem #1b81bc;
-          }
-        }
-      }
-    }
-    .tab-content {
-      display: flex;
-      align-items: center;
-      div {
-        margin-left: 0.1875rem;
-        color: #fff;
-        .content {
-          line-height: 0.275rem;
-          padding: 0.125rem 0;
-        }
-      }
-    }
-  }
-}
-</style>

echarts-screen/src/components/income.vue

@@ -1,185 +0,0 @@
-<!--
- 描述: 营业收入
- 作者: Jack Chen
- 日期: 2020-05-09
--->
-
-<template>
-  <div class="income-container"> 
-    <div class="chart" id="chart_left3"></div>  
-  </div>
-</template>
-
-<script>
-export default {
-  name: "income",
-  data() {
-    return {
-      
-    }
-  },
-  mounted() {
-    this.getEchartLeft3();
-  },
-  methods: {
-    getEchartLeft3() {
-      let myChart = echarts.init(document.getElementById('chart_left3'));
-      let data = {
-        city: ['2015', '2016', '2017', '2018', '2019', '2020'],
-        num: ['555', '896', '1935', '2922', '4508', '5000']
-      }
-
-      let option = {
-        tooltip: {
-          trigger: 'axis',
-          axisPointer: {
-            lineStyle: {
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [{
-                  offset: 0,
-                  color: 'rgba(255,255,255,0)' // 0% 处的颜色
-                }, {
-                  offset: 0.5,
-                  color: 'rgba(255,255,255,1)' // 100% 处的颜色
-                }, {
-                  offset: 1,
-                  color: 'rgba(255,255,255,0)' // 100% 处的颜色
-                }],
-                global: false // 缺省为 false
-              }
-            },
-          },
-          formatter: (value) => {
-            return value[0].name + '年营业收入：<br>' + value[0].value + '万元'; 
-          }
-        },
-        grid: {
-          top: '5%',
-          left: '2%',
-          right: '2%',
-          bottom: '0%',
-          containLabel: true
-        },
-        xAxis: [{
-          type: 'category',
-          boundaryGap: true,
-          axisLine: { //坐标轴轴线相关设置。数学上的x轴
-            show: false,
-            lineStyle: {
-              color: '#092b5d'
-            },
-          },
-          axisLabel: { //坐标轴刻度标签的相关设置
-            textStyle: {
-              color: '#24c4ff',
-              margin: 15,
-            },
-            formatter: (data) => {
-                return data.substr(2) + '年';
-            }
-          },
-          axisTick: {
-            show: false,
-          },
-          data: data.city
-        }],
-        yAxis: [{
-          min: 0,
-          max: 6000,
-          splitLine: {
-            show: false,
-            lineStyle: {
-              color: '#092b5d'
-            },
-          },
-          axisLine: {
-            show: false,
-            lineStyle: {
-              color: "#092b5d"
-            }
-          },
-          axisLabel: {
-            show: true,
-            textStyle: {
-              color: '#24c4ff',
-            }
-          },
-          axisTick: {
-            show: false,
-          },
-        }],
-        series: [{
-          name: '',
-          type: 'line',
-          symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
-          showAllSymbol: true,
-          symbolSize: 8,
-          lineStyle: {
-            normal: {
-              color: '#7c80f4', // 线条颜色
-            },
-            borderColor: 'rgba(0,0,0,.4)',
-          },
-          itemStyle: {
-            color: "rgba(14,30,73,1)",
-            borderColor: "#646ace",
-            borderWidth: 2
-          },
-          label: {
-            normal: {
-              show: true,
-              position: 'top',
-              formatter: [
-                ' {a|{c}}',
-              ].join(','),
-              rich: {
-                a: {
-                  color: '#fff',
-                  align: 'center',
-                },
-              }
-            }
-          },
-          smooth: true,
-          areaStyle: { //区域填充样式
-            normal: {
-              //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
-              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                offset: 0,
-                color: "rgba(124, 128, 244,.3)"
-              },{
-                offset: 1,
-                color: "rgba(124, 128, 244, 0)"
-              }], false),
-              shadowColor: 'rgba(53,142,215, 0.9)', //阴影颜色
-              shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
-            }
-          },
-          data: data.num
-        }]
-      }
-
-      myChart.setOption(option, true);
-      window.addEventListener('resize', () => {
-        myChart.resize();
-      })
-    },
-  },
-  beforeDestroy() {
-    
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.income-container {
-  .chart {
-    height: 3rem;
-  }
-}
-</style>

echarts-screen/src/components/index.js

@@ -1,76 +1,13 @@
-/*
- * 描述: 封装组件库
- * 作者: Jack Chen
- * 日期: 2020-04-18
- */
 
-// import bgAnimation from './bgAnimation' // 登录界面背景图动画
-// import modal from './modal' // 自定义全局模态框
-// import sinan from './sinan' // 司南排名图
-// import seamless from './seamless' // 新闻无缝滚动
-// import pyramid from './pyramid' // 金字塔动画
-// import scrollArc from './scrollArc' // 滚动弧形线
-// import szBar from './szBar' // 双轴柱状图
-// import ringPin from './ringPin' // 环形气泡图
-// import rotateColorful from './rotateColorful' // 旋转多彩图
-// import circleRunway from './circleRunway' // 环形跑道图
-// import scanRadius from './scanRadius' // 扫描半径图
-// import cakeLinkage from './cakeLinkage' // 柱饼组合联动
-// import dynamicLine from './dynamicLine' // 动态轮播折线图
-// import pyramidTrend from './pyramidTrend' // 金字塔趋势
-// import staffMix from './staffMix' // 人员占比
-// import flashCloud from './flashCloud' // 闪动云
-// import ringPie from './ringPie' // 环形饼图
-// import colorfulRadar from './colorfulRadar' // 多彩雷达
-// import dynamicList from './dynamicList' // 动态列表动画
-// import bar3d from './bar3d' // 3D立体柱状图
-// import colorfulArea from './colorfulArea' // 多彩轮播面积
-// import rainbow from './rainbow' // 彩虹轨道图
-// import gauge from './gauge' // 仪表盘
-// import waterPolo from './waterPolo' // 水球图
-// import circleNesting from './circleNesting' // 圆环套圆环
+import RoseCon from './RoseCon' // 客户分布
 
-import business from './business' // 业务范围
-import talent from './talent' // 人才队伍
-import income from './income' // 营业收入
-import wordCloud from './wordCloud' // 产品热词
-import distribution from './distribution' // 客户分布
-import history from './history' // 发展历程
+import PieCon from './PieCon' // 发展历程
 
 const components = {
-  // bgAnimation,
-  // modal,
-  // sinan,
-  // seamless,
-  // pyramid,
-  // scrollArc,
-  // szBar,
-  // ringPin,
-  // rotateColorful,
-  // circleRunway,
-  // scanRadius,
-  // cakeLinkage,
-  // dynamicLine,
-  // pyramidTrend,
-  // staffMix,
-  // flashCloud,
-  // ringPie,
-  // colorfulRadar,
-  // dynamicList,
-  // bar3d,
-  // colorfulArea,
-  // rainbow,
-  // gauge,
-  // waterPolo,
-  // circleNesting,
 
-  business,
-  talent,
-  income,
-  wordCloud,
-  distribution,
-  history,
-  
+
+  RoseCon,
+  PieCon,
 };
 
 const install = (Vue = {}) => {

echarts-screen/src/components/talent.vue

@@ -1,146 +0,0 @@
-<!--
- 描述: 人才队伍
- 作者: Jack Chen
- 日期: 2020-05-09
--->
-
-<template>
-  <div class="talent-container"> 
-    <div class="chart" id="chart_left2"></div>   
-  </div>
-</template>
-
-<script>
-export default {
-  name: "talent",
-  data() {
-    return {
-      
-    }
-  },
-  mounted() {
-    this.getEchartLeft2();
-  },
-  methods: {
-    getEchartLeft2() {
-      let myChart = echarts.init(document.getElementById('chart_left2'));
-      let scaleData = [{
-        name: '博士',
-        value: 5
-      },{
-        name: '硕士',
-        value: 10
-      },{
-        name: '本科',
-        value: 10
-      },{
-        name: '专科',
-        value: 10
-      },{
-        name: '国防科大',
-        value: 5
-      },{
-        name: '大厂专家',
-        value: 5
-      }];
-      let rich = {
-        white: {
-          color: '#ddd',
-          align: 'center',
-          padding: [3, 0]
-        }
-      };
-      let placeHolderStyle = {
-        normal: {
-          label: {
-            show: false
-          },
-          labelLine: {
-            show: false
-          },
-          color: 'rgba(0, 0, 0, 0)',
-          borderColor: 'rgba(0, 0, 0, 0)',
-          borderWidth: 0
-        }
-      };
-      let data = [];
-      let color=['#00ffff', '#00cfff', '#006ced', '#ffe000', '#ffa800', '#ff5b00', '#ff3000']
-      for (let i = 0; i < scaleData.length; i++) {
-        data.push({
-          value: scaleData[i].value,
-          name: scaleData[i].name,
-          itemStyle: {
-            normal: {
-              borderWidth: 6,
-              shadowBlur: 10,
-              borderColor: color[i],
-              shadowColor: color[i]
-            }
-          }
-        }, {
-          value: 2,
-          name: '',
-          itemStyle: placeHolderStyle
-        });
-      }
-
-      let option = {
-        series: [{
-          name: '',
-          type: 'pie',
-          clockWise: false,
-          radius: ['66%', '68%'],
-          center: ['50%', '50%'],
-          hoverAnimation: false,
-          itemStyle: {
-            normal: {
-              label: {
-                show: true,
-                position: 'outside',
-                color: '#ddd',
-                formatter: (params) => {
-                  let percent = 0;
-                  let total = 0;
-                  for (let i = 0; i < scaleData.length; i++) {
-                    total += scaleData[i].value;
-                  }
-                  percent = ((params.value / total) * 100).toFixed(0);
-                  if (params.name !== '') {
-                    return params.name + '\n{white|' + '占比' + percent + '%}';
-                  } else {
-                    return '';
-                  }
-                },
-                rich: rich
-              },
-              labelLine: {
-                length: 10,
-                length2: 30,
-                show: true,
-                color: '#00ffff'
-              }
-            }
-          },
-          data: data
-        }]
-      }
-
-      myChart.setOption(option, true);
-      window.addEventListener('resize', () => {
-        myChart.resize();
-      });
-    },
-  },
-  beforeDestroy() {
-    
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.talent-container {
-  .chart {
-    height: 3rem;
-  }
-}
-</style>

echarts-screen/src/components/wordCloud.vue

@@ -1,191 +0,0 @@
-<!--
- 描述: 产品热词
- 作者: Jack Chen
- 日期: 2020-05-09
--->
-
-<template>
-  <div class="word-container"> 
-    <div class="chart" id="chart_right1"></div>
-  </div>
-</template>
-
-<script>
-import '@/assets/js/echarts-wordcloud.min'
-
-export default {
-  name: "wordCloud",
-  data() {
-    return {
-      timer: null
-    }
-  },
-  mounted() {
-    this.getEchartRight1();
-    this.timer = setInterval(() => {
-      this.getEchartRight1();
-    }, 5000)
-  },
-  methods: {
-    getEchartRight1() {
-      let myChart = echarts.init(document.getElementById('chart_right1'));
-      let option = {
-        // tooltip: {
-        //   show: false
-        // },
-        series: [{
-          type: 'wordCloud',
-          gridSize: 1,
-          sizeRange: [12, 50],
-          rotationRange: [-90, 90],
-          rotationStep: 45,
-          shape: 'diamond',
-          width: '90%',
-          textPadding: 0,
-          autoSize: {
-            enable: true,
-            minSize: 6
-          },
-          textStyle: {
-            normal: {
-              textBorderColor: 'rgba(255,255,255,0.3)',
-              textBorderWidth: 1,
-              color: () => {
-                return 'rgb(' + [
-                  Math.round(Math.random() * 160),
-                  Math.round(Math.random() * 160),
-                  Math.round(Math.random() * 160)
-                ].join(',') + ')';
-              }
-            },
-            emphasis: {
-              fontSize: 20,
-              // shadowBlur: 10,
-              // shadowColor: 'rgba(255,255,255, .1)'
-            }
-          },
-          data: [{
-            name: '钟南山',
-            value: 810
-          }, {
-            name: '武汉',
-            value: 520
-          },{
-            name: "隔离",
-            value: 928
-          },{
-            name: "白衣天使",
-            value: 906
-          },{
-            name: "新增确诊",
-            value: 825
-          },{
-            name: "口罩",
-            value: 514
-          },{
-            name: "中国加油",
-            value: 486
-          },{
-            name: "阳性",
-            value: 53
-          },{
-            name: "驰援",
-            value: 927
-          },{
-            name: "新冠状病毒变异",
-            value: 1308
-          },{
-            name: "供应链",
-            value: 693
-          },{
-            name: "公有链",
-            value: 611
-          },{
-            name: "私有链",
-            value: 512
-          },{
-            name: "联盟链",
-            value: 382
-          },{
-            name: "数据共享",
-            value: 312
-          },{
-            name: "文创版权",
-            value: 187
-          },{
-            name: "天河链",
-            value: 163
-          },{
-            name: "数据存证",
-            value: 104
-          },{
-            name: "UDFS存储",
-            value: 3
-          },{
-            name: "在线教育",
-            value: 31
-          },{
-            name: "关联分析",
-            value: 941
-          },{
-            name: "智慧停车",
-            value: 585
-          },{
-            name: "链云生态",
-            value: 473
-          },{
-            name: "应用层",
-            value: 358
-          },{
-            name: "网络层",
-            value: 246
-          },{
-            name: "数据层",
-            value: 207
-          },{
-            name: "基础层",
-            value: 194
-          },{
-            name: "智能合约",
-            value: 104
-          },{
-            name: "去中心化",
-            value: 87
-          },{
-            name: "数字货币",
-            value: 415
-          },{
-            name: "酷屏",
-            value: 253
-          },{
-            name: "可视化",
-            value: 211
-          },{
-            name: "P2P",
-            value: 116
-          },{
-            name: "数据挖掘",
-            value: 1309
-          }]
-        }]
-      }
-
-      myChart.setOption(option, true);
-      window.addEventListener('resize', () => {
-        myChart.resize();
-      });
-    },
-  },
-  beforeDestroy() {
-    clearInterval(this.timer);
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.word-container {
-  .chart {
-    height: 3rem;
-  }
-}
-</style>

echarts-screen/src/views/Brand.vue

@@ -25,8 +25,8 @@
                         <div class="panel-footer"></div>
                     </div>
                     <div class="panel">
-                        <h2>人才队伍</h2>
-                        <talent/>
+                        <h2>新增病例情况</h2>
+                        <PieCon/>
                         <div class="panel-footer"></div>
                     </div>
                     <div class="panel">
@@ -74,8 +74,8 @@
                         <div class="panel-footer"></div>
                     </div>
                     <div class="panel">
-                        <h2>客户分布</h2>
-                        <distribution/>
+                        <h2>现存确诊</h2>
+                        <RoseCon/>
                         <div class="panel-footer"></div>
                     </div>
                     <div class="panel">