option = { title: { // 圆环中央文字 show: true, // 是否显示 text: ''+ 1000, subtext: '总分', textStyle: { fontSize: 20, fontWeight: 700, lineHeight: 12, color: '#303030' }, subtextStyle: { fontSize: 16, fontWeight: 600, lineHeight: 20, color: '#9b9b9b' }, textAlign: 'center', left: '49.6%', top: '41%' }, tooltip: { trigger: 'item', formatter: function (params, ticket, callback) { console.log(params, "bar") let dom = `

第一张资源与管理

得分 X

占比 X%

` return dom } }, legend: { left: 'center', bottom: 0, }, color: ['#5370c5', '#04bf8d', '#fac858', '#e2e2e2'], series: [ { name: '访问来源', type: 'pie', radius: [80, 100], avoidLabelOverlap: true, center: ['50%', '45%'], data: [// 空集合会展示暗色圆环 {value: 335, name: '直接访问'}, {value: 310, name: '邮件营销'}, {value: 234, name: '联盟广告'}, {value: 135, name: '视频广告'}, {value: 1548, name: '搜索引擎'} ], label: { formatter: function(params){ return params.value + " ("+params.percent.toFixed(0)+"%)"; }, rich: { value: { fontSize: 13, fontWeight: 'bold' } } }, animationEasing: 'cubicInOut', animationDuration: 2000 } ] };

Echarts在线免费图表