From 80dbc6e90c34705cc020d61c4fdb502491310101 Mon Sep 17 00:00:00 2001
From: "liu.shiyi" <liu.shiyi@ustcinfo.com>
Date: Tue, 25 Jun 2024 14:19:36 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E4=BC=98=E5=8C=96=E7=80=91=E5=B8=83?=
=?UTF-8?q?=E5=9B=BE=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../G2Plots/瀑布图/基础瀑布图.js | 70 ++++++++++++-------
1 file changed, 46 insertions(+), 24 deletions(-)
diff --git a/data-room-ui/packages/G2Plots/瀑布图/基础瀑布图.js b/data-room-ui/packages/G2Plots/瀑布图/基础瀑布图.js
index 79e1321d..0cbb498c 100644
--- a/data-room-ui/packages/G2Plots/瀑布图/基础瀑布图.js
+++ b/data-room-ui/packages/G2Plots/瀑布图/基础瀑布图.js
@@ -39,12 +39,39 @@ const setting = [
},
/** 样式配置 **/
// 图表 graph
+ // {
+ // label: '柱子颜色',
+ // type: 'gradual', // 设置组件类型
+ // field: 'color', // 字段
+ // optionField: 'color', // 对应options中的字段
+ // value: 'l(90) 0:#6B74E4 1:#4391F4',
+ // tabName: 'custom',
+ // groupName: 'graph'
+ // },
+ {
+ label: '上涨色',
+ type: 'colorPicker', // 设置组件类型
+ field: 'risingFill', // 字段
+ optionField: 'risingFill', // 对应options中的字段
+ value: '#f4664a',
+ tabName: 'custom',
+ groupName: 'graph'
+ },
+ {
+ label: '下降色',
+ type: 'colorPicker', // 设置组件类型
+ field: 'fallingFill', // 字段
+ optionField: 'fallingFill', // 对应options中的字段
+ value: '#30bf78',
+ tabName: 'custom',
+ groupName: 'graph'
+ },
{
- label: '柱子颜色',
- type: 'gradual', // 设置组件类型
- field: 'columnStyle_fill', // 字段
- optionField: 'columnStyle.fill', // 对应options中的字段
- value: 'l(90) 0:#6B74E4 1:#4391F4',
+ label: '总计色',
+ type: 'colorPicker', // 设置组件类型
+ field: 'total_style_fill', // 字段
+ optionField: 'total.style.fill', // 对应options中的字段
+ value: '#96a6a6',
tabName: 'custom',
groupName: 'graph'
},
@@ -129,15 +156,6 @@ const setting = [
tabName: 'custom',
groupName: 'graph'
},
- {
- label: '柱背景颜色',
- type: 'colorPicker',
- field: 'columnBackground_style_fill',
- optionField: 'columnBackground.style.fill',
- value: 'rgba(255,255,255,0)',
- tabName: 'custom',
- groupName: 'graph'
- },
// 网格线 grid
{
label: '虚线',
@@ -178,6 +196,15 @@ const setting = [
tabName: 'custom',
groupName: 'xAxis'
},
+ {
+ label: '总计标签',
+ type: 'input',
+ field: 'total_label',
+ optionField: 'total.label',
+ value: '',
+ tabName: 'custom',
+ groupName: 'yAxis'
+ },
{
label: '标题位置',
type: 'select',
@@ -330,6 +357,7 @@ const setting = [
tabName: 'custom',
groupName: 'yAxis'
},
+
{
label: '标题过长时旋转',
type: 'switch',
@@ -471,16 +499,16 @@ const option = {
data,
xField: 'type',
yField: 'money',
- color: '',
- columnStyle: { // 设置柱子渐变色
- fill: 'l(90) 0:#6B74E4 1:#4391F4'
- },
+ // color: 'l(90) 0:#6B74E4 1:#4391F4',
+ risingFill: '#f4664a',
+ fallingFill: '#30bf78',
total: {
label: '总支出',
style: {
fill: '#96a6a6'
}
},
+
label: {
offsetY: 13,
// 可手动配置 label 数据标签位置
@@ -569,12 +597,6 @@ const option = {
}
}
},
- // 背景图设置
- columnBackground: {
- style: {
- fill: 'rgba(255,255,255,0)'
- }
- },
meta: {
type: {
alias: '类别'