diff --git a/doc/docs/guide/chartsLinkage.md b/doc/docs/guide/chartsLinkage.md index bbc6305c..fa875cae 100644 --- a/doc/docs/guide/chartsLinkage.md +++ b/doc/docs/guide/chartsLinkage.md @@ -1,4 +1,5 @@ ## 简要说明 + 现有系统联动的本质是数据集查询参数“示例值”的替换, 现在联动有两种。
- 表单联动
@@ -7,6 +8,9 @@ - 图表联动:
目前联动主要集中在柱状图、折线图、饼图等这种二维图表,二维图表是指图表只支持2个字段的数据集,当然并不是说需要3个字段的堆叠图(柱状/折线)不支持联动,而是这种三维图表去联动二维图表会带来一些问题,反之二维的去联动三维的同样存在问题,因此目前源代码中只添加了部分二维图表的联动。
+**注:** +没有多级联动,联动都是一对一的。例如,时间筛选器绑定了A柱图,A柱图绑定了B饼图,当使用时间筛选器更改时间后,只会更新绑定的A柱图,A绑定的B饼图并不会更新数据。
+ ## 表单联动 ### 下拉框 @@ -169,8 +173,6 @@ function doHandleMonth(month) { } ``` - - ## 图表联动 - 简介
@@ -181,7 +183,8 @@ function doHandleMonth(month) { ![img11](../picture/chartsLinkage/img_11.png)
- **注意事项!!!**
- 1、用于被联动的动态数据集比如上面的示例数据集,查询参数在sql里面需要用 '' 或者 "",因为时间筛选器格式传递的数据中间有空格的。当然,如果不绑定时间筛选器那么sql里面直接使用数据库时间函数就行,例如DATE_FORMAT。
+ 1、用于被联动的动态数据集比如上面的示例数据集,查询参数在sql里面需要用 '' 或者 "" + ,因为时间筛选器格式传递的数据中间有空格的。当然,如果不绑定时间筛选器那么sql里面直接使用数据库时间函数就行,例如DATE_FORMAT。
2、联动与被联动的图表必须有相同的数据格式。理论上多维向低维填充数据是没问题的,但实际操作时带来的问题会很多,因此当前版本高维图表都不支持图表组件联动。
3、被联动的图表的动态数据集必须得有查询参数。说的简单一点就是联动始终都是数据集参数的传递,图表只是数据的载体表象。
4、使用后的情况和表单组件使用后情况一致。
diff --git a/report-ui/src/views/bigscreenDesigner/designer/linkageLogic.js b/report-ui/src/views/bigscreenDesigner/designer/linkageLogic.js index 4f03bc4f..7dea1d9d 100644 --- a/report-ui/src/views/bigscreenDesigner/designer/linkageLogic.js +++ b/report-ui/src/views/bigscreenDesigner/designer/linkageLogic.js @@ -43,6 +43,16 @@ export const lickageParamsConfig = [ code: 'widgetPiePercentageChart', paramsKey: ['value'] }, + { + name: '饼图', + code: 'widget-piechart', + paramsKey: ['name', 'value'] + }, + { + name: '南丁格尔玫瑰图', + code: 'WidgetPieNightingaleRoseArea', + paramsKey: ['name', 'value'] + }, ] export const getOneConfigByCode = function (code) { diff --git a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js index cb1d64c5..5383b5b0 100644 --- a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js +++ b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js @@ -338,6 +338,18 @@ export const widgetPieNightingale = { }, ], }, + { + name: '组件联动', + list: [ + { + type: 'componentLinkage', + label: '', + name: 'componentLinkage', + required: false, + value: [] + } + ] + } ], ], // 数据 diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue index 36340a0f..fdac657c 100644 --- a/report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue +++ b/report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue @@ -1,16 +1,22 @@