/*
 * @Author: gj
 * @Date: 2020-04-20 08:27:31
 * @Description: 饼状图表
 * @FilePath: \chart-component\example\customjs\echarts\pieChart.js
 */ 
const PieChart = ({data, element, colorList, clickBack})=>{
	let newData = data.reduce((item, next) => {
		item.push({
			name: next.key,
			value: next.value
		});
		return item;
	}, []);
	let legend=[];
	data.map((it)=>{
		legend.push(it.key)
	})
	let main = document.getElementById(element);
	const myChart = echartsV4.init(main);
	var option = {
    title: {
			// text: '标题',
			// subtext: '副标题',
			left: 'center'
    },
    tooltip: {
			trigger: 'item',
			formatter: '{b} : {c} ({d}%)'
    },
		color: colorList ? colorList : ['#00bfb7','#ff9080','#A276A4','#F36A5A','#CAC12C','#4C5667'],
    legend: {
			// orient: 'vertical',
			bottom: 10,
			data: legend
    },
    series: [
			{
				type: 'pie',
				radius: '46%',
				center: ['50%', '40%'],
				data: newData,
				label: {
					lineHeight: 60,
					formatter: '{b}({@2012})\n{d}%'
				},
				emphasis: {
					itemStyle: {
						shadowBlur: 10,
						shadowOffsetX: 0,
						shadowColor: 'rgba(0, 0, 0, 0.5)'
					}
				}
			}
    ]
	};
	myChart.on('click', function (params) {
		if (clickBack) {
			clickBack(params);
		}
	})
	myChart.setOption(option);
}
export default PieChart;