diff --git a/src/components/CustomPages/BI/BI014RiskPerformanceModel.js b/src/components/CustomPages/BI/BI014RiskPerformanceModel.js index 879f4a3..46cd171 100644 --- a/src/components/CustomPages/BI/BI014RiskPerformanceModel.js +++ b/src/components/CustomPages/BI/BI014RiskPerformanceModel.js @@ -660,13 +660,14 @@ class BI014RiskPerformanceModel extends React.Component { { barWidth: 20, name: "重大风险", + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 type: "bar", data: Data.LEVEL1, itemStyle: { color: this.state.level1Color }, label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -677,7 +678,7 @@ class BI014RiskPerformanceModel extends React.Component { }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -685,7 +686,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -695,7 +696,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -703,7 +704,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -713,7 +714,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -721,7 +722,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -847,8 +848,7 @@ class BI014RiskPerformanceModel extends React.Component { tooltip: { trigger: "axis", axisPointer: { - // 坐标轴指示器，坐标轴触发有效 - type: "shadow", // 默认为直线，可选为：'line' | 'shadow' + type: "shadow", }, }, legend: { @@ -876,9 +876,6 @@ class BI014RiskPerformanceModel extends React.Component { axisLabel: { interval: 0, rotate: 20, - formatter: function (value) { - return value; - }, }, }, ], @@ -889,66 +886,67 @@ class BI014RiskPerformanceModel extends React.Component { ], series: [ { - barWidth: 20, + barWidth: 20, // 只需第一个series配置宽度，全局生效 + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, itemStyle: { color: this.state.level1Color }, label: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 - formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 + position: 'inside', // 堆叠内部显示数字，防止重叠；想要顶部改为 top + formatter: '{c}', textStyle: { - fontSize: 12, // 字体大小 - color: '#333', // 字体颜色 + fontSize: 11, + color: '#fff', // 内部文字建议白色更清晰 }, }, }, { - barWidth: 20, + stack: 'risk', name: "较大风险", type: "bar", data: Data.LEVEL2, itemStyle: { color: this.state.level2Color }, label: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 - formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 + position: 'inside', + formatter: '{c}', textStyle: { - fontSize: 12, // 字体大小 - color: '#333', // 字体颜色 + fontSize: 11, + color: '#fff', }, }, }, { - barWidth: 20, + stack: 'risk', name: "一般风险", type: "bar", data: Data.LEVEL3, itemStyle: { color: this.state.level3Color }, label: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 - formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 + position: 'inside', + formatter: '{c}', textStyle: { - fontSize: 12, // 字体大小 - color: '#333', // 字体颜色 + fontSize: 11, + color: '#333', }, }, }, { - barWidth: 20, + stack: 'risk', name: "低风险", type: "bar", data: Data.LEVEL4, itemStyle: { color: this.state.level4Color }, label: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 - formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 + position: 'inside', + formatter: '{c}', textStyle: { - fontSize: 12, // 字体大小 - color: '#333', // 字体颜色 + fontSize: 11, + color: '#fff', }, }, }, @@ -1007,6 +1005,7 @@ class BI014RiskPerformanceModel extends React.Component { series: [ { barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, @@ -1014,7 +1013,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1024,7 +1023,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -1032,7 +1031,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1042,7 +1041,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -1050,7 +1049,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1060,7 +1059,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -1068,7 +1067,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1376,6 +1375,7 @@ class BI014RiskPerformanceModel extends React.Component { series: [ { barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, @@ -1384,7 +1384,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1394,7 +1394,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -1403,7 +1403,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1413,7 +1413,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -1422,7 +1422,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1432,7 +1432,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -1441,7 +1441,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1512,6 +1512,7 @@ class BI014RiskPerformanceModel extends React.Component { series: [ { barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, @@ -1520,7 +1521,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1531,7 +1532,7 @@ class BI014RiskPerformanceModel extends React.Component { }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -1540,7 +1541,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1550,7 +1551,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -1559,7 +1560,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1569,7 +1570,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -1578,7 +1579,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1649,6 +1650,7 @@ class BI014RiskPerformanceModel extends React.Component { series: [ { barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, @@ -1657,7 +1659,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1668,7 +1670,7 @@ class BI014RiskPerformanceModel extends React.Component { }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -1677,7 +1679,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1687,7 +1689,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -1696,7 +1698,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1706,7 +1708,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -1715,7 +1717,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1786,6 +1788,7 @@ class BI014RiskPerformanceModel extends React.Component { series: [ { barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "重大风险", type: "bar", data: Data.LEVEL1, @@ -1794,7 +1797,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1805,7 +1808,7 @@ class BI014RiskPerformanceModel extends React.Component { }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "较大风险", type: "bar", data: Data.LEVEL2, @@ -1814,7 +1817,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1824,7 +1827,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "一般风险", type: "bar", data: Data.LEVEL3, @@ -1833,7 +1836,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -1843,7 +1846,7 @@ class BI014RiskPerformanceModel extends React.Component { }, }, { - barWidth: 20, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 name: "低风险", type: "bar", data: Data.LEVEL4, @@ -1852,7 +1855,7 @@ class BI014RiskPerformanceModel extends React.Component { label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -2015,7 +2018,7 @@ class BI014RiskPerformanceModel extends React.Component { this.chart21(this.state.ret.Data.RISKTYPELIST[0], "露天矿", "1", "1", "1", "1"); this.chart22(this.state.ret.Data.RISKTYPELIST[1], "选矿厂", "1", "1", "1", "1"); this.chart23(this.state.ret.Data.RISKTYPELIST[2], "地下矿", "1", "1", "1", "1"); - this.chart24(this.state.ret.Data.RISKTYPELIST[3], "全公司", "1", "1", "1", "1"); + this.chart24(this.state.ret.Data.RISKTYPELIST[3], "尾矿库", "1", "1", "1", "1"); this.setState({ isShow1: true }) } else if (formCode == "生产单元") { @@ -2024,7 +2027,7 @@ class BI014RiskPerformanceModel extends React.Component { this.chart21(this.state.ret.Data.SCDYLIST[0], "露天矿", "1", "2", "3", "4"); this.chart22(this.state.ret.Data.SCDYLIST[1], "选矿厂", "1", "2", "3", "4"); this.chart23(this.state.ret.Data.SCDYLIST[2], "地下矿", "1", "2", "3", "4"); - this.chart24(this.state.ret.Data.SCDYLIST[3], "全公司", "1", "2", "3", "4"); + this.chart24(this.state.ret.Data.SCDYLIST[3], "尾矿库", "1", "2", "3", "4"); } else if (formCode == "层级") { this.setState({ isShow1: true }) titleTemp += "层级"; @@ -2038,14 +2041,14 @@ class BI014RiskPerformanceModel extends React.Component { this.chart21(this.state.ret.Data.TEAMLIST[0], "露天矿", "1", "1", "1", "1"); this.chart22(this.state.ret.Data.TEAMLIST[1], "选矿厂", "1", "1", "1", "1"); this.chart23(this.state.ret.Data.TEAMLIST[2], "地下矿", "1", "1", "1", "1"); - this.chart24(this.state.ret.Data.TEAMLIST[3], "全公司", "1", "1", "1", "1"); + this.chart24(this.state.ret.Data.TEAMLIST[3], "尾矿库", "1", "1", "1", "1"); } else if (formCode == "区域") { this.setState({ isShow1: true }) titleTemp += "区域"; this.chart21(this.state.ret.Data.AREALIST[0], "露天矿", "1", "1", "1", "1"); this.chart22(this.state.ret.Data.AREALIST[1], "选矿厂", "1", "1", "1", "1"); this.chart23(this.state.ret.Data.AREALIST[2], "地下矿", "1", "1", "1", "1"); - this.chart24(this.state.ret.Data.AREALIST[3], "全公司", "1", "1", "1", "1"); + this.chart24(this.state.ret.Data.AREALIST[3], "尾矿库", "1", "1", "1", "1"); } const newtmpData = { diff --git a/src/components/CustomPages/BI/BI056Dilg1_1.js b/src/components/CustomPages/BI/BI056Dilg1_1.js index 4491b3f..7fb9457 100644 --- a/src/components/CustomPages/BI/BI056Dilg1_1.js +++ b/src/components/CustomPages/BI/BI056Dilg1_1.js @@ -143,7 +143,7 @@ class BI056Dilg1_1 extends React.Component { const labelOption = { show: true, - position: 'top', + position: 'inside', formatter: '{c}', textStyle: { fontSize: 12, // 字体大小 @@ -186,6 +186,7 @@ class BI056Dilg1_1 extends React.Component { barWidth: this.state.barWidth, type: 'bar', barGap: 0, + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 label: labelOption, emphasis: { focus: 'series' diff --git a/src/components/CustomPages/BI/BI056Dilg1_2.js b/src/components/CustomPages/BI/BI056Dilg1_2.js index d7aa6ef..cfc7116 100644 --- a/src/components/CustomPages/BI/BI056Dilg1_2.js +++ b/src/components/CustomPages/BI/BI056Dilg1_2.js @@ -74,13 +74,14 @@ class BI056Dilg1_2 extends React.Component { listSeries.push({ name: Data.legendName[i], data: Data.checkrisk[i], + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 type: "bar", itemStyle: { color: this.state.ColorShow[i] }, barWidth: this.state.barWidth,//横轴的柱状图宽度 label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 diff --git a/src/components/CustomPages/BI/BI056Dilg3_1.js b/src/components/CustomPages/BI/BI056Dilg3_1.js index 4ca7748..a4ba815 100644 --- a/src/components/CustomPages/BI/BI056Dilg3_1.js +++ b/src/components/CustomPages/BI/BI056Dilg3_1.js @@ -75,7 +75,6 @@ class BI056Dilg3_1 extends React.Component { checkTypeCount4: ret.Data.Count3_1.length >= 4 ? ret.Data.Count3_1[3] : null,//[[4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4], [4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4], [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]], }, //将ret对象赋值给data, data供页面调用 }) - this.CheckCount(this.state.Data, "div1", 1); this.CheckCount(this.state.Data, "div2", 2); this.CheckCount(this.state.Data, "div3", 3); @@ -102,7 +101,7 @@ class BI056Dilg3_1 extends React.Component { const labelOption = { show: true, - position: 'top', + position: 'inside', formatter: '{c}', textStyle: { fontSize: 12, // 字体大小 @@ -131,6 +130,7 @@ class BI056Dilg3_1 extends React.Component { name: LegendName[i], barWidth: this.state.barWidth, type: 'bar', + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 barGap: 0, label: labelOption, emphasis: { diff --git a/src/components/CustomPages/BI/BI056Dilg3_2.js b/src/components/CustomPages/BI/BI056Dilg3_2.js index aaf4d57..3e5631f 100644 --- a/src/components/CustomPages/BI/BI056Dilg3_2.js +++ b/src/components/CustomPages/BI/BI056Dilg3_2.js @@ -95,7 +95,7 @@ class BI056Dilg3_2 extends React.Component { let myChart = echarts.init(divShow); const labelOption = { show: true, - position: 'top', + position: 'inside', formatter: '{c}', textStyle: { fontSize: 12, // 字体大小 @@ -124,6 +124,7 @@ class BI056Dilg3_2 extends React.Component { name: LegendName[i], barWidth: this.state.barWidth, type: 'bar', + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 barGap: 0, label: labelOption, emphasis: { diff --git a/src/components/CustomPages/BI/BI056Performance.js b/src/components/CustomPages/BI/BI056Performance.js index 815d42d..a1eb392 100644 --- a/src/components/CustomPages/BI/BI056Performance.js +++ b/src/components/CustomPages/BI/BI056Performance.js @@ -122,14 +122,46 @@ class BI056Performance extends React.Component { xAxisName: ret.Data.lisCheckTypeName, arrayCount: ret.Data.Count3_2, } - + console.log(checkTypeMineType3_1.arrayCount) + function filterZeroXItem(obj) { + const legendName = obj.legendName || []; // [全公司,露天矿,地下矿,选矿厂,尾矿库] + const xAxisName = obj.xAxisName || []; // 27个检查类型名称 + const arrayCount = obj.arrayCount || []; // 5*27 二维数组 + + const keepIndexList = []; + // 遍历每一个【检查类型下标】0~26 + for (let checkIndex = 0; checkIndex < xAxisName.length; checkIndex++) { + // 取出当前检查类型，5个矿区的数据 + const valuesOfCheckType = arrayCount.map(mineArr => mineArr[checkIndex]); + // 当前检查类型所有矿区求和 + const sum = valuesOfCheckType.reduce((s, v) => s + Number(v), 0); + // 总和>0才保留这个检查类型 + if (sum > 0) { + keepIndexList.push(checkIndex); + } + } + + // 筛选新的x轴名称 + const newXAxis = keepIndexList.map(i => xAxisName[i]); + // 对每个矿区数组，只保留符合条件下标 + const newArrayCount = arrayCount.map(mineArr => { + return keepIndexList.map(i => mineArr[i]); + }); + + return { + legendName: legendName, // 矿区名称不变 + xAxisName: newXAxis, + arrayCount: newArrayCount + } + } var lineData = { checkMineType1_1: checkMineType1_1, riskMineType1_2: riskMineType1_2, riskDealMonth2_1: riskDealMonth2_1, riskTop2_2: riskTop2_2, - checkTypeMineType3_1: checkTypeMineType3_1, - checkTypeRiskMineType3_2: checkTypeRiskMineType3_2 + // 返回过滤完成后的完整对象（三组数组同步删减） + checkTypeMineType3_1: filterZeroXItem(checkTypeMineType3_1), + checkTypeRiskMineType3_2: filterZeroXItem(checkTypeRiskMineType3_2) } this.setState({ Data: lineData @@ -242,13 +274,14 @@ class BI056Performance extends React.Component { { name: "公司级", type: "bar", + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 data: Data.checkCount[0], itemStyle: { color: this.state.ColorShow[0] }, barWidth: 30,//横轴的柱状图宽度 label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -262,13 +295,14 @@ class BI056Performance extends React.Component { { name: "部门级", type: "bar", + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 data: Data.checkCount[1], itemStyle: { color: this.state.ColorShow[1] }, barWidth: this.state.barWidth,// 30,//横轴的柱状图宽度 label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -280,13 +314,14 @@ class BI056Performance extends React.Component { { name: "车间级", type: "bar", + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 data: Data.checkCount[2], itemStyle: { color: this.state.ColorShow[2] }, barWidth: this.state.barWidth,// 30,//横轴的柱状图宽度 label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 @@ -298,13 +333,14 @@ class BI056Performance extends React.Component { { name: "班组级", type: "bar", + stack: 'risk', // 堆叠分组标识，相同值就堆叠在一起 data: Data.checkCount[3], barWidth: this.state.barWidth,// 30,//横轴的柱状图宽度 itemStyle: { color: this.state.ColorShow[3] }, label: { normal: { show: true, - position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 + position: 'inside', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置 formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数 textStyle: { fontSize: 12, // 字体大小 diff --git a/src/utils/customConfig.js b/src/utils/customConfig.js index 3a2387c..7029db4 100644 --- a/src/utils/customConfig.js +++ b/src/utils/customConfig.js @@ -193,12 +193,12 @@ const BIView = createLoadableComponent(() => import('../components/CustomPages/B // const BI052BSSafeCheckYear = createLoadableComponent(() => import('../components/CustomPages/BI/BI052BSSafeCheckYearOne')) // const BI053BSSafeCheckYear = createLoadableComponent(() => import('../components/CustomPages/BI/BI053BSSafeCheckYearOne')) const BI056Performance = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Performance')); -// const BI056Dilg1_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg1_1')) -// const BI056Dilg1_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg1_2')) -// const BI056Dilg2_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg2_1')) -// const BI056Dilg2_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg2_2')) -// const BI056Dilg3_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg3_1')) -// const BI056Dilg3_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg3_2')) +const BI056Dilg1_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg1_1')) +const BI056Dilg1_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg1_2')) +const BI056Dilg2_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg2_1')) +const BI056Dilg2_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg2_2')) +const BI056Dilg3_1 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg3_1')) +const BI056Dilg3_2 = createLoadableComponent(() => import('../components/CustomPages/BI/BI056Dilg3_2')) // const BI003StatiscialAnalysis = createLoadableComponent(() => import('../components/CustomPages/BI/BI003StatiscialAnalysis')) const BI020ApproveAnalysis = createLoadableComponent(() => import('../components/CustomPages/BI/BI020ApproveAnalysis')); const BI014RiskPerformanceModel = createLoadableComponent( @@ -431,12 +431,12 @@ export default function (componentName, formId, formParam, data, formCode, formD BI054HomeDetail: , BI055HomeDetail: , BI056Performance: , - // BI056Dilg1_1: , - // BI056Dilg1_2: , - // BI056Dilg2_1: , - // BI056Dilg2_2: , - // BI056Dilg3_1: , - // BI056Dilg3_2: , + BI056Dilg1_1: , + BI056Dilg1_2: , + BI056Dilg2_1: , + BI056Dilg2_2: , + BI056Dilg3_1: , + BI056Dilg3_2: , // BI003StatiscialAnalysis: , BI001HomeDetail: , BI002HomeDetail: ,