在echarts中圆环图中间 自定义图片引入

首先 打开echarts官网实例

https://www.echartsjs.com/examples/zh/editor.html?c=pie-doughnut

其次复制代码

app.title = '环形图';

option = {
    tooltip: {
        trigger: 'item',
        formatter: "{a} 
{b}: {c} ({d}%)"
    },
   
graphic: {
     elements: [
     	{
            type: 'image',
            style: {
                image: "https://yp.a-hh.cn/zhjk/img.jpg",
                width: 25,
                height: 30
                   },
            left: 'center',
            top: '70'
            },
            {
             type: 'text',
             left: 'center', // 相对父元素居中
             top: '110',  // 相对父元素上下的位置
             style: {
                 fill: '#333333',
                  text: ['总人数'],
                  font: '12px Arial Normal',
                     }
            }]
          },


    legend: {
        orient: 'vertical',
        x: 'left',
        data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
    },
    series: [
        {
            name:'访问来源',
            type:'pie',
            radius: ['50%', '70%'],
            avoidLabelOverlap: false,
            label: {
                normal: {
                    show: false,
                    position: 'center'
                },
                emphasis: {
                    show: true,
                    textStyle: {
                        fontSize: '30',
                        fontWeight: 'bold'
                    }
                }
            },
            labelLine: {
                normal: {
                    show: false
                }
            },
            data:[
                {value:335, name:'直接访问'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟广告'},
                {value:135, name:'视频广告'},
                {value:1548, name:'搜索引擎'}
            ]
        }
    ]
};

其实 就是 在option graphic属性中 添加 属性 在elements 第一个对象中 修改 引入图片的位置