分类要父子级展示用到echarts的嵌套饼图
drawCharts(datas) { let datas = [ [ {name: '', value} ], [ {name: '', value} ] ] console.log(datas, 'datasdatasdatas'); let dom = document.getElementById('stealPie'); let chartDom = echarts.init(dom); let option = { tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)', }, legend: { itemWidth: 15, //图例的宽度 itemHeight: 15, //图例的高度 itemGap: 10, orient: 'vertical', right: 'right', top: 'center', icon: 'rect', textStyle: { color: '#fff', fontSize: 14, }, type: 'scroll', pageIconColor: '#6495ed', //翻页下一页的三角按钮颜色 pageIconInactiveColor: '#aaa', //翻页（即翻页到头时） pageIconSize: 11, //翻页按钮大小 pageFormatter: '', //隐藏翻页的数字 pageButtonItemGap: -6, }, series: [ { type: 'pie', data: datas[0], // minAngle: 5, avoidLabelOverlap: true, label: { show: false, position: 'inside', }, radius: [0, 30], center: ['30%', '60%'], //边框位置 itemStyle: { borderWidth: 1, borderColor: "#05133A", // normal:{ // color:function(params) { // var colorList = ['#503EFF', '#733DFF', '#966EFF', '#3E6DFF', '#536EBF', '#6E93FF', '#5FEBFF', '#8AF1FF', '#8AF1FF']; // return colorList[params.dataIndex] // } // } }, clockwise: true, animation: false, }, { type: 'pie', data: datas[1], // minAngle: 5, avoidLabelOverlap: true, label: { color: '#ffffff', position: 'outside', }, labelLine: { normal: { smooth: 0.2, length: 5, length2: 10, lineStyle: { color: '#fff', }, } }, radius: [31, 60], center: ['30%', '60%'], //边框位置 itemStyle: { borderWidth: 1, borderColor: "#05133A", // normal:{ // color:function(params) { // var colorList = ['#02A09A', '#912CEE', '#90EE90', ' #8FBC8F', '#8F8F8F', '#8EE5EE', '#8E8E38', ' #8B8B83', ' #8B6914', '#8B4C39', ' #8470FF', ' #A020F0', ' #B22222', ' #CD2626', '#EEDC82', '#FF00FF', '#FFFF00']; // return colorList[params.dataIndex] // } // } }, animation: false, }, ], }; chartDom.setOption(option); },
