Vue implements the method of displaying percentage of echart pie chart legend

option = {
    title : {
        text: 'Source of user access to a certain site',
        subtext: 'Purely fictitious',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical', // Layout mode, the default is horizontal layout, optional: 'horizontal' ¦ 'vertical'
         // Horizontal placement, default is on the left, options are: 'center' | 'left' | 'right' | {number} (x coordinate, unit px)
        x: 'left',
        // Vertical placement, default is the top of the whole image, options are: 'top' | 'bottom' | 'center' | {number} (y coordinate, unit px)
        y: 'bottom',
        // Rewrite the legend display style formatter: function(name) {
              // Get the legend display content let data = option.series[0].data;
              let total = 0;
              let tarValue = 0;
              for (let i = 0, l = data.length; i < l; i++) {
                  total += data[i].value;
                  if (data[i].name == name) {
                      tarValue = data[i].value;
                  }
              }
              let p = (tarValue / total * 100).toFixed(2);
              return name + ' ' + ' ' + p + '%';
          },
        data: ['Direct access', 'Email marketing', 'Affiliate advertising', 'Video advertising', 'Search engine']
    },
    series: [
        {
            name: 'Access source',
            type: 'pie',
            radius : '55%',
            center: ['50%', '60%'],
            data:[
                {value:335, name:'Direct access'},
                {value:310, name:'Email Marketing'},
                {value:234, name:'Alliance Advertising'},
                {value:135, name:'Video Ad'},
                {value:1548, name:'search engine'}
            ],
            itemStyle: {
                emphasis:
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};