提交 2a12bcd2 authored 作者: 王鹏飞's avatar 王鹏飞

chore: update

上级 29c52a95
import { useDataQuery } from '@/hooks/useQuery'
import { Column, Line, Pie, Radar, Scatter, WordCloud } from '@ant-design/plots'
import { Column, Line, Pie, Radar, Scatter, WordCloud, Gauge, Treemap, Funnel, Histogram } from '@ant-design/plots'
export default function Chart({ type = '1', ...props }) {
const { data } = useDataQuery()
switch (type) {
case '1':
case '1': // 柱状图
return <Column data={data.list} {...props} />
case '2': {
const defaultConfig = {
data: data.list,
point: { shapeField: 'point', sizeField: 4 },
style: { lineWidth: 2 },
}
return <Line {...defaultConfig} {...props} />
}
case '3': {
const defaultConfig = {
data: data.list,
angleField: props.yField,
colorField: props.xField,
}
return <Pie {...defaultConfig} />
}
case '4':
case '2': // 折线图
return <Line data={data.list} point={{ shapeField: 'point', sizeField: 4 }} style={{ lineWidth: 2 }} {...props} />
case '3': // 饼状图
return <Pie data={data.list} angleField={props.yField} colorField={props.xField} {...props} />
case '4': // 雷达图
return <Radar data={data.list} {...props} />
case '5':
case '5': // 散点图
return <Scatter data={data.list} {...props} />
case '7':
case '6': // 气泡图
return <Scatter data={data.list} sizeField={props.sizeField || 'size'} {...props} />
case '7': // 词云
return <WordCloud data={data.list} {...props} />
case '8': // 地图
return <Column data={data.list} {...props} /> // 需要替换为地图组件
case '9': // 指标卡
return <Gauge data={data.list} percent={props.percent || 0.5} {...props} />
case '10': // 漏斗图
return <Funnel data={data.list} {...props} />
case '11': // 直方图
return <Histogram data={data.list} {...props} />
case '12': // 表格
return <Column data={data.list} {...props} /> // 需要替换为表格组件
case '13': // 帕累托图
return <Column data={data.list} {...props} /> // 需要替换为帕累托图组件
case '14': // 矩形树图
return <Treemap data={data.list} {...props} />
default:
return <Column data={data.list} {...props} />
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论