echarts饼图修改当前鼠标浮动数值信息等样式

echarts饼图修改当前鼠标浮动数值信息等样式

重点

 emphasis: {
   
              scale: true, // 关闭放大效果
              scaleSize: 5,
              label: {
   
                show: true,
                fontSize: 10,
                color: '#fff',
                fontWeight: 'bold',
                // formatter: '{fs20|{b}}\n{c} ({d}%)',
                formatter: '{c|{d}}{b| %}\n\n{a|{b}}',
                // formatter: function (params) {
   
                //   console.log(params);
                //   let { percent, name } = params;
                //   return [
                //     `{c| ${percent}}`, // 这里注意返回数组类型，内为对象，对象必须包裹成字符串，c为当前文字标识，| 后为你想显示的值
                //     `{a|  }%`,
                //     `{b| ${name}}`,
                //   ].join('\n') // 换行
                // },
                rich: {
   
                  // 定义c类文字样式
                  // 水质类别文字
                  a: {
   
                    fontSize: 12,
                    fontWeight: 350,
                    fontFamily: 'Source Han Sans CN-Normal',
                    color: 'rgba(255, 255, 255, 0.80)',
                  },
                  // 百分比数值
                  c: {
   
                    fontSize: 20,
                    fontWeight: 700,
                    fontFamily: 'D-DIN-DIN-Bold',
                    color: '#fff',
                  },
                  // 百分号
                  b: {
   
                    fontSize: 10,
                    fontWeight: 400,
                    fontFamily: 'D-DIN-DIN-Bold',
                    color: '#ffffff',
                  }
                }

                // formatter: function (value) {
   
                //   console.log(value);
                //   return value.percent + '%\n' + value.name
                // },
              }
            },

整体

   // 初始化
    initCategoryChart(data)