echarts地图修改图例

要求：根据数据排名，前三名点亮橙色，其他地区根据数值分配不同颜色，并且要加上单位
效果图如下：

实现方法如下：

visualMapFormat(list) {
     //先将数据按从大到小的顺序排列
     //当list长度为1时，点亮这1个
     //当list长度为1-3时，点亮第一个
     //当list长度为3-8时，判断并列第三名的个数，当第三名超过2个时，只有前2名是橙色，否则点亮前三名
     //当list长度大于8时，点亮前三名
        list.sort((a, b) => {
          return b.value - a.value;
        });
      let VMOptions = [];
      if (list.length === 1) {
        VMOptions = [
          {gt: this.numToCeil(list[0].value, false), color: color},
        ];
      } else if (list.length > 1 && list.length <= 3) {
        VMOptions = [
          {gte: this.numToCeil(list[0].value, false), color: color},
          {lt: this.numToCeil(list[0].value, false), color: "#1360D3"},
        ];
      } else if (list.length > 3 && list.length <= 8) {
        let thirdNum = list.filter(item => item.value === list[2].value).length;  
        //获取第三名的个数
        //当第三名超过2个时，只有前2名是橙色
        if(thirdNum>=2){
          VMOptions = [
            {min: Math.round(list[2].value), color: color},
            {
              min: this.numToCeil(list[2].value / 2, false),
              max: Math.round(list[2].value),
              color: "#79CBFF",
            },
            {max: this.numToCeil(list[2].value / 2, false), color: "#023280"},
          ];
        }else{
          VMOptions = [
            {min: this.numToCeil(list[1].value, false), color: color},
            {
              min: this.numToCeil(list[2].value / 2, false),
              max: this.numToCeil(list[1].value, false),
              color: "#79CBFF",
            },
            {max: this.numToCeil(list[2].value / 2, false), color: "#023280"},
          ];
        }
      } else if (list.length == 0) {
        return
      } else {
        let single = this.numToCeil(list[4].value / 5, false);
        VMOptions = [
          {min: this.numToCeil(list[2].value, false), color: color},
          {
            min: single * 5,
            max: this.numToCeil(list[2].value, false),
            color: "#79CBFF",
          },
          {min: single * 4, max: single * 5, color: "#79CBFF"},
          {min: single * 3, max: single * 4, color: "#3996FF"},
          {min: single * 2, max: single * 3, color: "#1360D3"},
          {min: single, max: single * 2, color: "#0A49A8"},
          {max: single, color: "#023280"},
        ];
      }
      this.chinaOption.visualMap.pieces = VMOptions;
      //处理显示格式
      this.chinaOption.visualMap.formatter = (start, end) => {
        if (start === -Infinity) {
          let array = this.setUnit(end)
          return '< ' + array[0] + array[1]
        } else if (end === Infinity) {
          let array = this.setUnit(start)
          return '>' + array[0] + array[1]
        } else {
          let array1 = this.setUnit(start)
          let array2 = this.setUnit(end)
          return array1[0] + '-' + array2[0] + array2[1]
        }
      }
    },

//根据数值设置相应的单位
 setUnit(num) {
      let unit = ''
      if (num * 3 > 100000000) {
          num = Math.round(num / 100000000)
          unit = '亿人'
      } else if (num * 3 > 10000) {
          num = (num / 10000).toFixed(2)
          unit = '万人'
      } else {
          unit = '人'
      }
      return [num, unit]
    },

// 数据取整
    numToCeil(num, type) {
      let outPut = 0;
      if (0 < num && num <= 10) {
        outPut = num;
      } else if (10 < num && num < 100) {
        outPut = type ? Math.ceil(num / 5) * 5 : Math.floor(num / 5) * 5;
      } else if (num >= 100 && num < 10000) {
        outPut = type ? Math.ceil(num / 10) * 10 : Math.floor(num / 10) * 10;
      } else if (num >= 10000) {
        outPut = type
            ? Math.ceil(num / 100) * 100
            : Math.floor(num / 100) * 100;
      }
      return Math.round(outPut);
    },

完成。