Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
S
saas-bi
项目
项目
详情
活动
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
图表
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
EzijingWeb
saas-bi
Commits
2a12bcd2
提交
2a12bcd2
authored
3月 28, 2025
作者:
王鹏飞
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
chore: update
上级
29c52a95
显示空白字符变更
内嵌
并排
正在显示
1 个修改的文件
包含
40 行增加
和
21 行删除
+40
-21
Chart.tsx
src/components/chart/Chart.tsx
+40
-21
没有找到文件。
src/components/chart/Chart.tsx
浏览文件 @
2a12bcd2
import
{
useDataQuery
}
from
'@/hooks/useQuery'
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
})
{
export
default
function
Chart
({
type
=
'1'
,
...
props
})
{
const
{
data
}
=
useDataQuery
()
const
{
data
}
=
useDataQuery
()
switch
(
type
)
{
switch
(
type
)
{
case
'1'
:
case
'1'
:
// 柱状图
return
<
Column
data=
{
data
.
list
}
{
...
props
}
/>
return
<
Column
data=
{
data
.
list
}
{
...
props
}
/>
case
'2'
:
{
const
defaultConfig
=
{
case
'2'
:
// 折线图
data
:
data
.
list
,
return
<
Line
data=
{
data
.
list
}
point=
{
{
shapeField
:
'point'
,
sizeField
:
4
}
}
style=
{
{
lineWidth
:
2
}
}
{
...
props
}
/>
point
:
{
shapeField
:
'point'
,
sizeField
:
4
},
style
:
{
lineWidth
:
2
},
case
'3'
:
// 饼状图
}
return
<
Pie
data=
{
data
.
list
}
angleField=
{
props
.
yField
}
colorField=
{
props
.
xField
}
{
...
props
}
/>
return
<
Line
{
...
defaultConfig
}
{
...
props
}
/>
}
case
'4'
:
// 雷达图
case
'3'
:
{
const
defaultConfig
=
{
data
:
data
.
list
,
angleField
:
props
.
yField
,
colorField
:
props
.
xField
,
}
return
<
Pie
{
...
defaultConfig
}
/>
}
case
'4'
:
return
<
Radar
data=
{
data
.
list
}
{
...
props
}
/>
return
<
Radar
data=
{
data
.
list
}
{
...
props
}
/>
case
'5'
:
case
'5'
:
// 散点图
return
<
Scatter
data=
{
data
.
list
}
{
...
props
}
/>
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
}
/>
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
:
default
:
return
<
Column
data=
{
data
.
list
}
{
...
props
}
/>
return
<
Column
data=
{
data
.
list
}
{
...
props
}
/>
}
}
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论