var data = [{
value: 50,
itemStyle: {
color: '#b37119'
},
children: [{
value: 5,
itemStyle: {
color: '#f1c067'
},
children: [{
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
},
children: [{
name: '1',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
},
children: [{
name: '2',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
}
}, {
name: '3',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
name: '4',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}]
}, {
value: 5,
itemStyle: {
color: '#f1c067'
},
children: [{
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
},
children: [{
name: '5',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
},
children: [{
name: '6',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
}
}, {
name: '7',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
name: '8',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}]
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
opacity: 0
}
}, {
value: 5,
itemStyle: {
color: '#f1c067'
},
children: [{
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
},
children: [{
name: '9',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
},
children: [{
name: '10',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
}
}, {
name: '11',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
name: '12',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}]
}, {
value: 5,
itemStyle: {
color: '#f1c067'
},
children: [{
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
},
children: [{
name: '13',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
},
children: [{
name: '14',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#e5e0dc'
}
}, {
name: '15',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
name: '16',
value: 2.5,
itemStyle: {
borderWidth: 1,
color: '#faf3ed'
}
}]
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}, {
value: 1,
itemStyle: {
borderWidth: 3,
color: '#f1c067'
}
}]
}]
}];
option = {
backgroundColor: "#030c2b",
series: {
silent: true,
type: 'sunburst',
data: data,
radius: [0, '10%'],
center: ['50%', '75%'],
sort: null,
emphasis: {
focus: 'ancestor'
},
label: {
rotate: 'tangential',
fontSize: 20,
color: '#000',
fontFamily: 'serif',
fontStyle: 'oblique'
},
levels: [{}, {
r0: 5,
r: '5%'
}, {
r0: '5%',
r: '20%',
}, {
r0: '20%',
r: '40%',
}, {
r0: '40%',
r: '70%'
}, {
r0: '70%',
r: '100%'
}]
}
}
点击运行 》