echarts 饼图中间添加图片


饼图添加图片只需要配置两部分

option = {
    graphic: { // 这个属性可以在饼图内部填充图片,文字等
        elements: [{
            type: 'image',//需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
            style: {
                image: giftImageUrl, //这里添加图片地址
                width: 110,
                height: 120
            },
            left: 'center',//
            top: 'middle' //配置图片居中
        }]
    },
   
    series: [{
        type: 'pie',
        radius: ['27%', '45%'],//在这里配置外半径值,和外半径可视部分的大小
        center: ['50%', '50%'],
        color: ['#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'],
        data: data,
        labelLine: {
            normal: {
                show: false,
                length: 20,
                length2: 20,
                lineStyle: {
                    color: '#12EABE',
                    width: 2
                }
            }
        },
       
    }]
};


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM