| | |
| | | ] |
| | | }; |
| | | chart.setOption(option,true); |
| | | }, |
| | | drawPie0:function(chart,params){ |
| | | const colorList = ['#F09595', '#A4EEDA','#F6C18B', '#86C1F4','#91A0FC','#59CB74', '#FBD444', '#7F6AAD', '#585247'] |
| | | let option = { |
| | | title: { |
| | | text: '总工时', |
| | | textStyle: { |
| | | fontSize: 18, |
| | | color: '#000', |
| | | lineHeight: 20 |
| | | }, |
| | | textAlign: 'center', |
| | | left: '18.8%', |
| | | top: '45%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item', |
| | | }, |
| | | legend: { |
| | | type: 'scroll', |
| | | orient: 'vertical', |
| | | right: '10%', |
| | | top: 'center', |
| | | itemGap: 30, |
| | | selectedMode: false, |
| | | icon: 'rect', |
| | | data: params.data.map((d) => d.name), |
| | | textStyle: { |
| | | color: '#3D3D3D', |
| | | fontSize:'12px', |
| | | rich: { |
| | | name: { |
| | | width: 60, |
| | | }, |
| | | hours: { |
| | | width: 60, |
| | | }, |
| | | penl: { |
| | | width: 60, |
| | | } |
| | | } |
| | | }, |
| | | formatter(name) { |
| | | const item = params.data.find((d) => d.name === name); |
| | | return `{name|${item.name}}{hours|${item.value}小时}{penl|${item.penl}%}` |
| | | } |
| | | }, |
| | | color: colorList, |
| | | series: [ |
| | | { |
| | | name: '工时', |
| | | type: 'pie', |
| | | radius: [60, 90], |
| | | center: ['20%', '50%'], |
| | | label: { |
| | | show: false |
| | | }, |
| | | labelLine: { |
| | | show: false |
| | | }, |
| | | itemStyle: { |
| | | borderWidth: 1, |
| | | borderColor: '#fff' |
| | | }, |
| | | data: params.data, |
| | | } |
| | | ] |
| | | } |
| | | chart.setOption(option,true); |
| | | } |
| | | } |
| | | |