klinsmaya/SQLBot
1
0
Fork 0
mirror of https://gh-proxy.org/https://github.com/klinsmaya/SQLBot.git synced 2026-11-08 01:06:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: column, bar and line charts support series

Browse Source
This commit is contained in:
ulleo
2025-06-16 14:28:53 +08:00
parent 35def63d0d
commit 8ffa457231
4 changed files with 22 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/template.yaml
+6 -6
View File
@@ -48,14 +48,14 @@ template:
- 如果需要表格，则生成的 JSON 格式应为：
{{"type":"table", "title": "标题", "columns": [{{"name":"中文字段名1", "value": "SQL 查询列 1(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, {{"name": "中文字段名 2", "value": "SQL 查询列 2(有别名用别名,去掉外层的反引号、双引号、方括号)"}}]}}
必须从 SQL 查询列中提取“columns”。
- 如果需要柱状图，则生成的 JSON 格式应为：
{{"type":"column", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称", "value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}
- 如果需要柱状图，则生成的 JSON 格式应为（如果有分类则在JSON中返回series）：
{{"type":"column", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称", "value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "series": {{"name":"分类的中文名称","value":"SQL 查询分类的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}}}
必须从 SQL 查询列中提取“x”和“y”。
- 如果需要条形图，则生成的 JSON 格式应为：
{{"type":"bar", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称", "value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}
- 如果需要条形图，则生成的 JSON 格式应为（如果有分类则在JSON中返回series）：
{{"type":"bar", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称", "value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "series": {{"name":"分类的中文名称","value":"SQL 查询分类的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}}}
必须从 SQL 查询列中提取“x”和“y”。
- 如果需要折线图，则生成的 JSON 格式应为：
{{"type":"line", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称","value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}
- 如果需要折线图，则生成的 JSON 格式应为（如果有分类则在JSON中返回series）：
{{"type":"line", "title": "标题", "axis": {{"x": {{"name":"x轴的中文名称","value": "SQL 查询 x 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "y": {{"name":"y轴的中文名称","value": "SQL 查询 y 轴的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "series": {{"name":"分类的中文名称","value":"SQL 查询分类的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}}}
其中“x”和“y”必须从SQL查询列中提取。
- 如果需要饼图，则生成的 JSON 格式应为：
{{"type":"pie", "title": "标题", "axis": {{"y": {{"值轴的中文名称","value":"SQL 查询数值的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}, "series": {{"name":"分类的中文名称","value":"SQL 查询分类的列(有别名用别名,去掉外层的反引号、双引号、方括号)"}}}}
frontend/src/views/chat/component/charts/Bar.ts
+6
View File
@@ -8,8 +8,10 @@ export class Bar extends BaseG2Chart {
init(axis: Array<ChartAxis>, data: Array<ChartData>) {
super.init(axis, data)
const x = this.axis.filter((item) => item.type === 'x')
const y = this.axis.filter((item) => item.type === 'y')
const series = this.axis.filter((item) => item.type === 'series')
if (x.length == 0 || y.length == 0) {
return
@@ -28,5 +30,9 @@ export class Bar extends BaseG2Chart {
nice: true,
})
.interaction('elementHighlight', { background: true })
if (series.length > 0) {
this.chart?.encode('color', series[0].value).transform({ type: 'stackY' })
}
}
}
frontend/src/views/chat/component/charts/Column.ts
+5
View File
@@ -11,6 +11,7 @@ export class Column extends BaseG2Chart {
const x = this.axis.filter((item) => item.type === 'x')
const y = this.axis.filter((item) => item.type === 'y')
const series = this.axis.filter((item) => item.type === 'series')
if (x.length == 0 || y.length == 0) {
return
@@ -28,5 +29,9 @@ export class Column extends BaseG2Chart {
nice: true,
})
.interaction('elementHighlight', { background: true })
if (series.length > 0) {
this.chart?.encode('color', series[0].value).transform({ type: 'stackY' })
}
}
}
frontend/src/views/chat/component/charts/Line.ts
+5
View File
@@ -11,6 +11,7 @@ export class Line extends BaseG2Chart {
const x = this.axis.filter((item) => item.type === 'x')
const y = this.axis.filter((item) => item.type === 'y')
const series = this.axis.filter((item) => item.type === 'series')
if (x.length == 0 || y.length == 0) {
return
@@ -27,6 +28,10 @@ export class Line extends BaseG2Chart {
nice: true,
})
if (series.length > 0) {
this.chart?.encode('color', series[0].value)
}
this.chart?.line().label({
text: y[0].value,
style: {