数组重复的元素以键值对形式储存 | 取出键值数组的属性或值

1、这里的i就是一个计数器，当遇到相同的时本身加1，起到一个计算的作用 

2、取出键值数组的值，也就是上面计数的数值

3、取出键值数组的属性，也就是上面数组的属性名

 这样我们就把我们需要的数据分开存储在了两个数组里面

4、有以下要求：

用echarts画一个柱状图

// 柱状图的配置
    initEcharts() {
      const option = {
        color: ['#99ccff'],
        title: {
          text: '柱状图人员统计'
        },
        tooltip: {},
        legend: {
          data: ['人数']
        },
        xAxis: {
          type: 'category',
          data: this.countName
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            name: '人数',
            data: this.countDigital,
            type: 'bar', //类型为柱状图
            showBackground: true,
            backgroundStyle: {
              color: 'rgba(180, 180, 180, 0.1)'
              // color: '#9F8F6'
            }
          }
        ]
      };
      const myChart = echarts.init(this.$refs.mychart); // 图标初始化
      myChart.setOption(option); // 渲染页面
      //随着屏幕大小调节图表
      window.addEventListener('resize', () => {
        myChart.resize();
      });
    },

还有一个饼状图：

这里有一个值得注意的地方就是饼状图需要的数据格式是键值数组，那我们就需要把刚刚分开的那两个数组进行合并键值对象数组

// 饼状图的配置
    initPie() {
      // 把科室名和科室人数转换为echarts所需要的格式，即把两个数组转成一个对象数组

      for (let index in this.countName) {
        // console.log('11' + this.countName);
        this.pieData.push({
          value: this.countDigital[index],
          name: this.countName[index]
        });
        4;
      }
      console.log(this.pieData);

      const option = {
        title: {
          text: '饼状图人员统计',
          subtext: 'Data',
          left: 'center'
        },
        tooltip: {
          trigger: 'item'
        },
        legend: {
          orient: 'vertical',
          left: 'left'
        },
        series: [
          {
            name: 'Access From',
            type: 'pie', //类型为饼状图
            radius: '50%',
            data: this.pieData,
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
            }
          }
        ]
      };
      const myChart = echarts.init(this.$refs.pie); // 图标初始化
      myChart.setOption(option); // 渲染页面
      //随着屏幕大小调节图表
      window.addEventListener('resize', () => {
        myChart.resize();
      });
    }

5、注意 在此过程中因为我们数据获取需要时间，当我们push进数组的时候还没有得到数据，所有可能会出现页面不会展示图表的情况，我们需要设一个定时器，当然这是比较简单的方法但是有时候网络慢一点获取没有那么快也是会出问题

 setTimeout(() => {
      console.log('这是要开始用了' + this.countName);
      this.initEcharts();
      this.initPie();
    }, 1500);

上一步实在mounted实施的