pie的点击效果ECharts Gallery

20:11:45图表已生成
代码
option = {
    series: [{
        name: '心率数据',
        type: 'pie',
        radius: ['50%', '70%'],
        label: {
            normal: {
                textStyle: {

                },
                formatter: function(param) {
                    return param.name;
                }
            }
        },
        labelLine: {
            normal: {
                show: true,
                length: 10,
                length2: 20,
                lineStyle: {
                   
                }
            }
        },
        data: [{
            "name": "2分钟\n心肺训练",
            "value": 2,
            "itemStyle": {
                "normal": {
                    "color": '#f72c2e'
                }
            }
        }, {
            "name": "13分钟\n心肺训练",
            "value": 13,
            "itemStyle": {
                "normal": {
                    "color": "#fea621"
                }
            }
        }, {
            "name": "21分钟\n糖分消耗",
            "value": 21,
            "itemStyle": {
                "normal": {
                    "color": "#98cf44"
                }
            }
        }, {
            "name": "20分钟\n燃烧脂肪",
            "value": 20,
            "itemStyle": {
                "normal": {
                    "color": "#118b43"
                }
            }
        }, {
            "name": "4分钟\n动态热身",
            "value": 4,
            "itemStyle": {
                "normal": {
                    "color": "#4b7cde"
                }
            }
        }, {
            "name": "5分钟\n激活放松",
            "value": 5,
            "itemStyle": {
                "normal": {
                    "color": "#32b6cf"
                }
            }
        }]
    }, {
        name: '心率数据',
        type: 'pie',
        label: {
            normal: {
                position: 'inner',
                formatter: function(param) {
                    return Math.round(param.percent) + '%';
                }
            }
        },
        radius: ['25%', '70%'],
        data: [{
            "name": "",
            "value": 2,
            "itemStyle": {
                "normal": {
                    "color": '#f72c2e'
                }
            }
        }, {
            "name": "",
            "value": 13,
            "itemStyle": {
                "normal": {
                    "color": "#fea621"
                }
            }
        }, {
            "name": "",
            "value": 21,
            "itemStyle": {
                "normal": {
                    "color": "#98cf44"
                }
            }
        }, {
            "name": "",
            "value": 20,
            "itemStyle": {
                "normal": {
                    "color": "#118b43"
                }
            }
        }, {
            "name": "",
            "value": 4,
            "itemStyle": {
                "normal": {
                    "color": "#4b7cde"
                }
            }
        }, {
            "name": "",
            "value": 5,
            "itemStyle": {
                "normal": {
                    "color": "#32b6cf"
                }
            }
        }]
    }],
    itemStyle: {
        normal: {
            // 阴影的大小
            shadowBlur: 0,
            // 阴影水平方向上的偏移
            shadowOffsetX: 0,
            // 阴影垂直方向上的偏移
            shadowOffsetY: 0,
            // 阴影颜色
            shadowColor: 'rgba(0, 0, 0, 0.5)'
        },
        emphasis: {
            shadowBlur: 30,
            shadowColor: 'rgba(0, 0, 0, 0.3)'
        }
    }
}

setTimeout(function() {
    myChart.dispatchAction({
        type: 'highlight',
        seriesIndex: 1,
        dataIndex: 2
    });
}, 10);
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
