From 05d02aa1cdd3b5c42e6bbb11267096407303be28 Mon Sep 17 00:00:00 2001 From: "hong.yang" Date: Wed, 15 Nov 2023 14:17:49 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E6=9F=B1=E7=8A=B6=E5=9B=BE=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E6=96=B0=E5=A2=9Ex=E8=BD=B4=E8=87=AA=E5=8A=A8?= =?UTF-8?q?=E9=9A=90=E8=97=8F=E6=A0=87=E7=AD=BE=E7=9A=84=E5=88=A4=E5=AE=9A?= =?UTF-8?q?=E9=97=B4=E9=9A=94=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../G2Plots/柱状图/分组柱状图.js | 50 ++++++++++++++----- .../G2Plots/柱状图/圆角柱状图.js | 50 ++++++++++++++----- .../G2Plots/柱状图/基础柱状图.js | 42 +++++++++++++--- .../G2Plots/柱状图/堆叠柱状图.js | 50 ++++++++++++++----- 4 files changed, 148 insertions(+), 44 deletions(-) diff --git a/data-room-ui/packages/G2Plots/柱状图/分组柱状图.js b/data-room-ui/packages/G2Plots/柱状图/分组柱状图.js index 927afef3..9d878863 100644 --- a/data-room-ui/packages/G2Plots/柱状图/分组柱状图.js +++ b/data-room-ui/packages/G2Plots/柱状图/分组柱状图.js @@ -5,7 +5,7 @@ */ // 配置版本号 -const version = '2023111401' +const version = '2023111501' // 分类 const category = 'Column' // 标题 @@ -327,10 +327,10 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时旋转', + label: '标签过多时隐藏', type: 'switch', - field: 'xAxis_label_autoRotate', - optionField: 'xAxis.label.autoRotate', + field: 'xAxis_label_autoHide', + optionField: 'xAxis.label.autoHideEnable', value: true, active: true, inactive: false, @@ -338,11 +338,22 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时隐藏', + label: '标签隐藏判定间隔', + type: 'inputNumber', + field: 'xAxis_label_autoHide_minGap', + optionField: 'xAxis.label.autoHideMinGap', + value: 0, + tabName: 'custom', + groupName: 'xAxis' + }, + { + label: '标签过多时旋转', type: 'switch', - field: 'xAxis_label_autoHide', - optionField: 'xAxis.label.autoHide', + field: 'xAxis_label_autoRotate', + optionField: 'xAxis.label.autoRotate', value: true, + active: true, + inactive: false, tabName: 'custom', groupName: 'xAxis' }, @@ -498,11 +509,24 @@ const data = [ ] // 配置处理脚本 -const optionHandler = ' option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === \'legendPosition\').value} : false;\n' + - ' if (option.legendEnable) {\n' + - ' option.legend.itemName = option.legendItemName\n' + - ' };' + - 'option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === \'yAxis_grid_line_style_lineDash\').value]' +const optionHandler = + ` +option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === 'legendPosition').value} : false; +if (option.legendEnable) { + option.legend.itemName = option.legendItemName +}; +option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === 'yAxis_grid_line_style_lineDash').value] +let autoHide = setting.find(settingItem=>settingItem.field === 'xAxis_label_autoHide').value +if(autoHide){ + let minGap = option.xAxis.label.autoHideMinGap + option.xAxis.label.autoHide = { + type: 'equidistance', + cfg: { minGap: minGap } + } +} else { + option.xAxis.label.autoHide = false +} + ` // 数据处理脚本 const dataHandler = '' @@ -551,6 +575,8 @@ const option = { autoRotate: false, autoHide: true, autoEllipsis: true, + autoHideEnable: true, + autoHideMinGap: 2, style: { fill: '#8C8C8C', fontSize: 12 diff --git a/data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js b/data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js index 69968898..8cb95b08 100644 --- a/data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js +++ b/data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js @@ -5,7 +5,7 @@ */ // 配置版本号 -const version = '2023111401' +const version = '2023111501' // 分类 const category = 'Column' // 标题 @@ -327,10 +327,10 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时旋转', + label: '标签过多时隐藏', type: 'switch', - field: 'xAxis_label_autoRotate', - optionField: 'xAxis.label.autoRotate', + field: 'xAxis_label_autoHide', + optionField: 'xAxis.label.autoHideEnable', value: true, active: true, inactive: false, @@ -338,11 +338,22 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时隐藏', + label: '标签隐藏判定间隔', + type: 'inputNumber', + field: 'xAxis_label_autoHide_minGap', + optionField: 'xAxis.label.autoHideMinGap', + value: 0, + tabName: 'custom', + groupName: 'xAxis' + }, + { + label: '标签过多时旋转', type: 'switch', - field: 'xAxis_label_autoHide', - optionField: 'xAxis.label.autoHide', + field: 'xAxis_label_autoRotate', + optionField: 'xAxis.label.autoRotate', value: true, + active: true, + inactive: false, tabName: 'custom', groupName: 'xAxis' }, @@ -498,11 +509,24 @@ const data = [ ] // 配置处理脚本 -const optionHandler = 'option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === \'legendPosition\').value} : false;' + - ' if (option.legendEnable) {\n' + - ' option.legend.itemName = option.legendItemName\n' + - ' };' + - 'option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === \'yAxis_grid_line_style_lineDash\').value]' +const optionHandler = + ` +option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === 'legendPosition').value} : false; +if (option.legendEnable) { + option.legend.itemName = option.legendItemName +}; +option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === 'yAxis_grid_line_style_lineDash').value] +let autoHide = setting.find(settingItem=>settingItem.field === 'xAxis_label_autoHide').value +if(autoHide){ + let minGap = option.xAxis.label.autoHideMinGap + option.xAxis.label.autoHide = { + type: 'equidistance', + cfg: { minGap: minGap } + } +} else { + option.xAxis.label.autoHide = false +} + ` // 数据处理脚本 const dataHandler = '' @@ -561,6 +585,8 @@ const option = { autoRotate: false, autoHide: true, autoEllipsis: true, + autoHideEnable: true, + autoHideMinGap: 2, style: { fill: '#8C8C8C', fontSize: 12 diff --git a/data-room-ui/packages/G2Plots/柱状图/基础柱状图.js b/data-room-ui/packages/G2Plots/柱状图/基础柱状图.js index 2ea31ce2..4a126e2a 100644 --- a/data-room-ui/packages/G2Plots/柱状图/基础柱状图.js +++ b/data-room-ui/packages/G2Plots/柱状图/基础柱状图.js @@ -5,7 +5,7 @@ */ // 配置版本号 -const version = '2023111401' +const version = '2023111501' // 分类 const category = 'Column' // 标题 @@ -281,10 +281,10 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时旋转', + label: '标签过多时隐藏', type: 'switch', - field: 'xAxis_label_autoRotate', - optionField: 'xAxis.label.autoRotate', + field: 'xAxis_label_autoHide', + optionField: 'xAxis.label.autoHideEnable', value: true, active: true, inactive: false, @@ -292,11 +292,22 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时隐藏', + label: '标签隐藏判定间隔', + type: 'inputNumber', + field: 'xAxis_label_autoHide_minGap', + optionField: 'xAxis.label.autoHideMinGap', + value: 0, + tabName: 'custom', + groupName: 'xAxis' + }, + { + label: '标签过多时旋转', type: 'switch', - field: 'xAxis_label_autoHide', - optionField: 'xAxis.label.autoHide', + field: 'xAxis_label_autoRotate', + optionField: 'xAxis.label.autoRotate', value: true, + active: true, + inactive: false, tabName: 'custom', groupName: 'xAxis' }, @@ -445,7 +456,20 @@ const data = [ { date: '2023年', value: 400 } ] // 配置处理脚本 -const optionHandler = 'option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === \'yAxis_grid_line_style_lineDash\').value]' +const optionHandler = + ` +option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === 'yAxis_grid_line_style_lineDash').value] +let autoHide = setting.find(settingItem=>settingItem.field === 'xAxis_label_autoHide').value +if(autoHide){ + let minGap = option.xAxis.label.autoHideMinGap + option.xAxis.label.autoHide = { + type: 'equidistance', + cfg: { minGap: minGap } + } +} else { + option.xAxis.label.autoHide = false +} + ` // 数据处理脚本 const dataHandler = '' @@ -487,6 +511,8 @@ const option = { autoRotate: false, autoHide: true, autoEllipsis: true, + autoHideEnable: true, + autoHideMinGap: 2, style: { fill: '#8C8C8C', fontSize: 12 diff --git a/data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js b/data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js index 27abd9d3..7d4f2412 100644 --- a/data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js +++ b/data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js @@ -5,7 +5,7 @@ */ // 配置版本号 -const version = '2023111401' +const version = '2023111501' // 分类 const category = 'Column' // 标题 @@ -327,10 +327,10 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时旋转', + label: '标签过多时隐藏', type: 'switch', - field: 'xAxis_label_autoRotate', - optionField: 'xAxis.label.autoRotate', + field: 'xAxis_label_autoHide', + optionField: 'xAxis.label.autoHideEnable', value: true, active: true, inactive: false, @@ -338,11 +338,22 @@ const setting = [ groupName: 'xAxis' }, { - label: '标签过多时隐藏', + label: '标签隐藏判定间隔', + type: 'inputNumber', + field: 'xAxis_label_autoHide_minGap', + optionField: 'xAxis.label.autoHideMinGap', + value: 0, + tabName: 'custom', + groupName: 'xAxis' + }, + { + label: '标签过多时旋转', type: 'switch', - field: 'xAxis_label_autoHide', - optionField: 'xAxis.label.autoHide', + field: 'xAxis_label_autoRotate', + optionField: 'xAxis.label.autoRotate', value: true, + active: true, + inactive: false, tabName: 'custom', groupName: 'xAxis' }, @@ -498,11 +509,24 @@ const data = [ ] // 配置处理脚本 -const optionHandler = 'option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === \'legendPosition\').value} : false;' + - ' if (option.legendEnable) {\n' + - ' option.legend.itemName = option.legendItemName\n' + - ' };' + - 'option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === \'yAxis_grid_line_style_lineDash\').value]' +const optionHandler = + ` +option.legend = option.legendEnable ? {position: setting.find(settingItem=>settingItem.field === 'legendPosition').value} : false; +if (option.legendEnable) { + option.legend.itemName = option.legendItemName +}; +option.yAxis.grid.line.style.lineDash = [4,setting.find(settingItem=>settingItem.field === 'yAxis_grid_line_style_lineDash').value] +let autoHide = setting.find(settingItem=>settingItem.field === 'xAxis_label_autoHide').value +if(autoHide){ + let minGap = option.xAxis.label.autoHideMinGap + option.xAxis.label.autoHide = { + type: 'equidistance', + cfg: { minGap: minGap } + } +} else { + option.xAxis.label.autoHide = false +} + ` // 数据处理脚本 const dataHandler = '' @@ -557,6 +581,8 @@ const option = { autoRotate: false, autoHide: true, autoEllipsis: true, + autoHideEnable: true, + autoHideMinGap: 2, style: { fill: '#8C8C8C', fontSize: 12