export const renderEchart = ({ echart, echarts, pieChartData }) => { const typeColorMap = { 需冲刺: { color: '#EB5241', simpleName: '冲' }, 较稳妥: { color: '#F0BA16', simpleName: '稳' }, 可保底: { color: '#15C496', simpleName: '保' }, } const formattedData = pieChartData.value.map((item) => ({ ...item, itemStyle: { color: typeColorMap[item.name]?.color, }, label: { formatter: (params) => typeColorMap[params.name]?.simpleName || params.name, }, })) echart.value.init(echarts, (chart) => { let option = { tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)', }, legend: { orient: 'horizontal', bottom: 8, left: 'center', icon: 'circle', itemWidth: 10, itemHeight: 10, itemGap: 20, }, series: [ { type: 'pie', radius: ['40%', '70%'], data: formattedData, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)', }, }, label: { formatter: (params) => typeColorMap[params.name]?.simpleName || params.name, }, }, ], graphic: { elements: [ { type: 'text', left: 'center', top: '40%', style: { text: '适合的大学', fontSize: 12, fill: '#1F2329', textAlign: 'center', textVerticalAlign: 'middle', }, }, { type: 'text', left: 'center', top: '50%', style: { text: formattedData.reduce((acc, curr) => acc + curr.value, 0), fontSize: 24, fill: '#1F2329', textAlign: 'center', textVerticalAlign: 'middle', fontWeight: 'bold', }, }, ], }, } chart.setOption(option) }) }