diff --git a/core/core-frontend/src/locales/en.ts b/core/core-frontend/src/locales/en.ts index bd02308e35..908523c779 100644 --- a/core/core-frontend/src/locales/en.ts +++ b/core/core-frontend/src/locales/en.ts @@ -2093,7 +2093,8 @@ export default { quota_col_label: 'Quota Column Label', table_grand_total_label: 'Total Alias', table_field_total_label: 'Field Alias', - table_row_header_freeze: 'Row Header Freeze' + table_row_header_freeze: 'Row Header Freeze', + value_formatter_total_out_percent: 'Show percentage' }, dataset: { field_value: 'Field Value', diff --git a/core/core-frontend/src/locales/tw.ts b/core/core-frontend/src/locales/tw.ts index ab70da653d..ec9bce3112 100644 --- a/core/core-frontend/src/locales/tw.ts +++ b/core/core-frontend/src/locales/tw.ts @@ -2034,7 +2034,8 @@ export default { quota_col_label: '指標列名', table_grand_total_label: '總計別名', table_field_total_label: '字段別名', - table_row_header_freeze: '行頭凍結' + table_row_header_freeze: '行頭凍結', + value_formatter_total_out_percent: '顯示佔比' }, dataset: { field_value: '欄位值', diff --git a/core/core-frontend/src/locales/zh-CN.ts b/core/core-frontend/src/locales/zh-CN.ts index 24e473cddb..c20756b1f9 100644 --- a/core/core-frontend/src/locales/zh-CN.ts +++ b/core/core-frontend/src/locales/zh-CN.ts @@ -2040,7 +2040,8 @@ export default { quota_col_label: '指标列名', table_grand_total_label: '总计别名', table_field_total_label: '字段别名', - table_row_header_freeze: '行头冻结' + table_row_header_freeze: '行头冻结', + value_formatter_total_out_percent: '显示占比' }, dataset: { field_value: '字段值', diff --git a/core/core-frontend/src/models/chart/chart.d.ts b/core/core-frontend/src/models/chart/chart.d.ts index bca4d0b0b3..544d413060 100644 --- a/core/core-frontend/src/models/chart/chart.d.ts +++ b/core/core-frontend/src/models/chart/chart.d.ts @@ -114,6 +114,10 @@ declare interface BaseFormatter { * 千分符 */ thousandSeparator: boolean + /** + * 显示总出占比 + */ + showTotalPercent: boolean } /** diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/TooltipSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/TooltipSelector.vue index 5532a2b878..7da217b071 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/TooltipSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/TooltipSelector.vue @@ -456,6 +456,9 @@ watch( } } ) +const showTotalPercent = computed(() => { + return props.chart.type === 'sankey' +}) onMounted(() => { init() useEmitt({ name: 'addAxis', callback: updateSeriesTooltipFormatter }) @@ -697,6 +700,15 @@ onMounted(() => { :label="t('chart.value_formatter_thousand_separator')" /> + + +
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/sankey.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/sankey.ts index f751b9deb6..2d3be53567 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/sankey.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/sankey.ts @@ -176,6 +176,13 @@ export class SankeyBar extends G2PlotChartView { if (customAttr.tooltip) { const t = JSON.parse(JSON.stringify(customAttr.tooltip)) if (t.show) { + // 计算每个source节点的总出 + const outTotal = {} + if (Array.isArray(options.data)) { + options.data?.forEach(d => { + outTotal[d.source] = (outTotal[d.source] || 0) + d.value + }) + } tooltip = { showTitle: false, showMarkers: false, @@ -186,6 +193,16 @@ export class SankeyBar extends G2PlotChartView { }, formatter: (datum: Datum) => { const { source, target, value } = datum + // 总出占比 + if (t.tooltipFormatter.showTotalPercent) { + const decimalCount = + t.tooltipFormatter.type !== 'auto' ? t.tooltipFormatter.decimalCount : 2 + const ratio = (value / outTotal[source]).toFixed(decimalCount) + return { + name: source + ' -> ' + target, + value: valueFormatter(value, t.tooltipFormatter) + ` (${ratio}%)` + } + } return { name: source + ' -> ' + target, value: valueFormatter(value, t.tooltipFormatter)