import useEcharts from "@/Hook/useEcharts"
import React from "react"

function Zonghaoshu(data: number[]) {
    data = Object.values(data).map((v: number) => v)
    const { Echarts } = useEcharts()
    return <>
        <Echarts style={{ width: '100%', height: 300 }}>
            {
                {
                    tooltip: {
                        formatter: function (data: any) {
                            return `${data.name}<br>总号数\n:\n${data.value[0]}<br>在投号数\n:\n${data.value[1]}<br>停投号数\n:\n${data.value[2]}`
                        }
                    },
                    radar: {
                        // shape: 'circle',
                        name: {
                            textStyle: {
                                color: '#fff',
                                backgroundColor: '#999',
                                borderRadius: 3,
                                padding: [3, 5]
                            }
                        },
                        indicator: [
                            { name: '总', max: data[0] },
                            { name: '在投', max: data[0] },
                            { name: '停投', max: data[0] },

                        ]
                    },
                    series: [{
                        type: 'radar',
                        areaStyle: {},
                        color: '#ff9800',
                        data: [
                            {
                                value: data,
                                name: '总号数/在投号数/停投号数'
                            },
                        ]
                    }]
                }
            }
        </Echarts>
    </>
}
export default React.memo(Zonghaoshu)
