html我就不寫出來了,這個className是id=「isShowSector」來的不是class=「isShowSector」,只是我名字改了一下,下面就是個人配置。html
let nameArray= ["±800kv", "±500kv", "550KV", "220kv", "110kv", "35kv"];echarts
let valueArray= [{value:6,name:"±800kv"},{value:14,name:"±500kv"},{value:151,name:"550KV"},{value:901,name:"220kv"},{value:3629,name:"110kv"},{value:2951,name:"35kv"}]this
let className= "isShowSector";spa
let colorList = ['#2073f3', '#ec6941', '#d6ce4b', '#3ac544', '#ffff00', '#c00167'];3d
function createPercentage(nameArray, valueArray, colorList, className) {code
let myclass = echarts.init(document.getElementById(className)); var option = { tooltip: { trigger: 'item', formatter: "{a} <br/>{b}: {c} ({d}%)", position: ['60%', '60%'], textStyle: { fontSize: 8, color: '#fff' } }, legend: [{ orient: 'auto', itemWidth: 5, itemHeight: 6, height: '100%', textStyle: { color: '#fff', fontSize: this.fontSize(12) }, width: '100%', data: valueArray, x: 'centent', bottom: '0' , }], color: colorList, series: [{ name: null, type: 'pie', radius: ['35%', '65%'], avoidLabelOverlap: false, center: ['50%', '50%'], labelLine: { normal: { show: true, lineStyle: { color: '#fff' }, smooth: 0.2, length: 18, length2: 30, } }, label: { normal: { show: true, textStyle: { color: '#ff8f03' }, }, emphasis: { show: true, textStyle: { fontSize: '14', fontWeight: 'bold' } } }, data: valueArray }] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }) }