import * as echarts from 'echarts'
import _ from 'lodash';
export const getOption = (datas) => {
    datas = datas?.reverse();
    let max = _.max(datas?.map(data => data.acreage));
    max = max * 1.2
    const colors = ['#1F68E2', '#E2C334', '#00E9CB', '#44DA84', '#747DF8', '#31B9FF'];
    const sum = _.sumBy(datas, 'acreage');
    return {
        tooltip:{},
        legend: {
            show: true,
            orient: 'vertical',
            right: '0',
            icon: 'circle',
            itemWidth: 10,
            itemHeight: 10,
            top: 'center',
            textStyle: {
                color: '#fff',
                fontSize: 14,
            },
            itemGap: 16,
            formatter: function (name) {
                let index = datas.findIndex((item) => item.name === name);
                const item = datas[index];
                if (!item) {
                    return null;
                }
                const unit = item.unit;
                const valueText = item.acreage
                return `${item.name} ${valueText} ${unit}`;
            },
        },
        series: [
            {
                showEmptyCircle: true,
                name: '',
                type: 'pie',
                minAngle: 10,
                radius: ['50', '80'],
                center: ['30%', '50%'],
                // roseType: 'area',
                color: colors,
                label: {
                    show: false
                },

                // itemStyle: {
                //     borderRadius: 5,
                //     borderColor: '#ffffff00',
                //     borderWidth: 5
                // },
                data: datas?.map?.(data => {
                    return {
                        name: data.name,
                        value: data.acreage
                    }
                })
            },
            {
                type: 'pie',
                radius: ['92', '94'],
                data: [
                    {
                        value: 50,
                        name: '',
                        itemStyle: {
                            color: '#ffffff4d'
                        }
                    },
                ],
                center: ['30%', '50%'],
                label: {
                    show: false
                }
            }
        ]
    };

}