可以通过设置 itemStyle 属性来调整饼图的数据项样式,具体步骤如下:

  1. series 中设置 itemStyle 属性,如下所示:
series: [{
    type: 'pie',
    data: [
        {value: 335, name: '直接访问'},
        {value: 310, name: '邮件营销'},
        {value: 234, name: '联盟广告'},
        {value: 135, name: '视频广告'},
        {value: 1548, name: '搜索引擎'}
    ],
    itemStyle: {
        borderColor: '#fff',
        borderWidth: 2
    }
}]
  1. itemStyle 中设置相应的样式属性,例如 borderColorborderWidth 等。

完整的饼图示例代码如下:

option = {
    title: {
        text: '饼图示例',
        left: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b}: {c} ({d}%)'
    },
    series: [
        {
            name: '访问来源',
            type: 'pie',
            radius: ['50%', '70%'],
            avoidLabelOverlap: false,
            label: {
                show: false,
                position: 'center'
            },
            emphasis: {
                label: {
                    show: true,
                    fontSize: '30',
                    fontWeight: 'bold'
                }
            },
            labelLine: {
                show: false
            },
            data: [
                {value: 335, name: '直接访问'},
                {value: 310, name: '邮件营销'},
                {value: 234, name: '联盟广告'},
                {value: 135, name: '视频广告'},
                {value: 1548, name: '搜索引擎'}
            ],
            itemStyle: {
                borderColor: '#fff',
                borderWidth: 2
            }
        }
    ]
};
echarts饼图的数据项如何调样式

原文地址: https://www.cveoy.top/t/topic/bem8 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录