Echarts 实心饼图示例
把以下代码复制粘贴到:https://gallery.echartsjs.com/editor.html 可以预览看到效果图。
option = {
color: ['#298DFF', ' #37CCCC', '#4ECC74', '#FBD438', '#EBA676', '#F2647C', '#9860E5', '#2F32CE', '#192761'],
backgroundColor: '#FFFFFF',
barWidth: 8,
tooltip: {
axisPointer: {
type: 'shadow'
},
trigger: 'item',
formatter: '{b} : {c}%'
},
legend: {
icon: 'circle',
type: 'scroll',
// type: 'plain',
orient: 'vertical',
right: 20,
top: '20%',
// bottom: 0,
data: ['医药', '信息技术', '社会服务', '农业', '建筑业', '能源', '房地产业', '金融业', '半导体']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
series: [
{
name: '',
type: 'pie',
radius: [0, 80],
center: ["50%", "50%"],
itemStyle: {
borderWidth: 1,
borderColor: '#fff'
},
emphasis: {
itemStyle: {
borderWidth: 0,
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
},
label: { //去除饼图的指示折线
normal: {
show: false,
// position: 'inside',
formatter:"{b}:{d}"
},
emphasis: {
show: false
}
},
data: [
{ value: 120, name: '医药' },
{ value: 100, name: '信息技术' },
{ value: 125, name: '社会服务' },
{ value: 125, name: '农业' },
{ value: 120, name: '建筑业' },
{ value: 135, name: '能源' },
{ value: 130, name: '房地产业' },
{ value: 140, name: '金融业' },
{ value: 140, name: '半导体' }
]
}
]
}
本文来自博客园,作者:叶子玉,转载请注明原文链接:https://www.cnblogs.com/knuzy/p/13895456.html