diff --git a/src/components/CustomPages/BI/BI006FormRunAnalysis.js b/src/components/CustomPages/BI/BI006FormRunAnalysis.js index d593cc6..0fe4599 100644 --- a/src/components/CustomPages/BI/BI006FormRunAnalysis.js +++ b/src/components/CustomPages/BI/BI006FormRunAnalysis.js @@ -372,12 +372,13 @@ class BI006FormRunAnalysis extends React.Component { legend: { // data: ['部门'], data: ["完成率", "及时完成率"], - bottom: "10px", + top: "3%", }, grid: { left: "3%", right: "4%", - top: "3%", + top: "15%", + bottom: "5%", containLabel: true, }, toolbox: { @@ -387,48 +388,127 @@ class BI006FormRunAnalysis extends React.Component { }, xAxis: { type: "category", - boundaryGap: false, + boundaryGap: false, //坐标轴两边留白 data: month, - axisLine: { - show: false, - // lineStyle: { - // color: 'rgba(192, 192, 102)' - // } + axisLabel: { + //坐标轴刻度标签的相关设置。 + interval: 0, //设置为 1,表示『隔一个标签显示一个标签』 + // margin:15, + textStyle: { + color: "#1B253A", + fontStyle: "normal", + fontFamily: "微软雅黑", + fontSize: 12, + }, + + //rotate:50, }, axisTick: { + //坐标轴刻度相关设置。 show: false, }, - axisLabel: { - color: "#000", - rotate: 40, - formatter: function (value) { - // 自定义文字超出部分 ... - if (value.length > 10) { - return `${value.slice(0, 10)}...`; - } - return value; + axisLine: { + //坐标轴轴线相关设置 + lineStyle: { + color: "#E5E9ED", + // opacity:0.2 + }, + }, + splitLine: { + //坐标轴在 grid 区域中的分隔线。 + show: true, + lineStyle: { + color: "#E5E9ED", + // opacity:0.1 }, }, }, - yAxis: { - axisLabel: { - formatter: function (val) { - return val + "%"; + yAxis: [ + { + type: "value", + splitNumber: 5, + axisLabel: { + textStyle: { + color: "#a8aab0", + fontStyle: "normal", + fontFamily: "微软雅黑", + fontSize: 12, + }, + formatter: function (val) { + return val + "%"; + }, + }, + axisLine: { + show: false, + }, + axisTick: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: "#E5E9ED", + // opacity:0.1 + }, }, }, - }, + ], series: [ { name: "完成率", type: "line", - color: "#4b9bf3", + // color: "#4b9bf3", data: company, + smooth: true, + itemStyle: { + normal: { + color: "#3A84FF", + lineStyle: { + color: "#3A84FF", + width: 1, + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ + { + offset: 0, + color: "rgba(58,132,255,0)", + }, + { + offset: 1, + color: "rgba(58,132,255,0.35)", + }, + ]), + }, + }, + }, }, { name: "及时完成率", type: "line", - color: "#FCD149", + // color: "#FCD149", data: department, + smooth: true, + itemStyle: { + normal: { + color: "#ff99ad", + lineStyle: { + color: "#ff99ad", + width: 1, + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ + { + offset: 0, + color: "rgba(250,80,113,0)", + }, + { + offset: 1, + color: "rgba(250,80,113,0.35)", + }, + ]), + }, + }, + }, }, ], }); @@ -486,12 +566,13 @@ class BI006FormRunAnalysis extends React.Component { legend: { // data: ['部门'], data: ["完成率", "及时完成率"], - bottom: "10px", + top: "3%", }, grid: { left: "3%", right: "4%", - top: "3%", + top: "15%", + bottom: "5%", containLabel: true, }, toolbox: { @@ -501,48 +582,127 @@ class BI006FormRunAnalysis extends React.Component { }, xAxis: { type: "category", - boundaryGap: false, + boundaryGap: false, //坐标轴两边留白 data: month, - axisLine: { - show: false, - // lineStyle: { - // color: 'rgba(192, 192, 102)' - // } + axisLabel: { + //坐标轴刻度标签的相关设置。 + interval: 0, //设置为 1,表示『隔一个标签显示一个标签』 + // margin:15, + textStyle: { + color: "#1B253A", + fontStyle: "normal", + fontFamily: "微软雅黑", + fontSize: 12, + }, + + //rotate:50, }, axisTick: { + //坐标轴刻度相关设置。 show: false, }, - axisLabel: { - color: "#000", - rotate: 40, - formatter: function (value) { - // 自定义文字超出部分 ... - if (value.length > 10) { - return `${value.slice(0, 10)}...`; - } - return value; + axisLine: { + //坐标轴轴线相关设置 + lineStyle: { + color: "#E5E9ED", + // opacity:0.2 + }, + }, + splitLine: { + //坐标轴在 grid 区域中的分隔线。 + show: true, + lineStyle: { + color: "#E5E9ED", + // opacity:0.1 }, }, }, - yAxis: { - axisLabel: { - formatter: function (val) { - return val + "%"; + yAxis: [ + { + type: "value", + splitNumber: 5, + axisLabel: { + textStyle: { + color: "#a8aab0", + fontStyle: "normal", + fontFamily: "微软雅黑", + fontSize: 12, + }, + formatter: function (val) { + return val + "%"; + }, + }, + axisLine: { + show: false, + }, + axisTick: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: "#E5E9ED", + // opacity:0.1 + }, }, }, - }, + ], series: [ { name: "完成率", type: "line", - color: "#4b9bf3", + // color: "#4b9bf3", data: company, + smooth: true, + itemStyle: { + normal: { + color: "#3A84FF", + lineStyle: { + color: "#3A84FF", + width: 1, + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ + { + offset: 0, + color: "rgba(58,132,255,0)", + }, + { + offset: 1, + color: "rgba(58,132,255,0.35)", + }, + ]), + }, + }, + }, }, { name: "及时完成率", type: "line", - color: "#FCD149", + // color: "#FCD149", data: department, + smooth: true, + itemStyle: { + normal: { + color: "#ff99ad", + lineStyle: { + color: "#ff99ad", + width: 1, + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ + { + offset: 0, + color: "rgba(250,80,113,0)", + }, + { + offset: 1, + color: "rgba(250,80,113,0.35)", + }, + ]), + }, + }, + }, }, ], }); @@ -1154,9 +1314,22 @@ class BI006FormRunAnalysis extends React.Component { marginTop: "20px", }} > - - -

+ + +

矿山部-安全生产标准化运行走势图

- +

- 部门统计分析 + {/* */} + 部门统计分析

- + + +

+ 选矿部-安全生产标准化运行走势图 +

+
+ + + + +

+ {/* */} + 模块统计分析 +

+
+ + + + {/*

- + */} ); diff --git a/src/components/CustomPages/BI/BI051BSCompanyYearOne.js b/src/components/CustomPages/BI/BI051BSCompanyYearOne.js index 9123b18..19f46b0 100644 --- a/src/components/CustomPages/BI/BI051BSCompanyYearOne.js +++ b/src/components/CustomPages/BI/BI051BSCompanyYearOne.js @@ -151,10 +151,6 @@ class BI051BSCompanyYear extends React.Component { } }); // COUNTTOTAL - console.log( - data.listSafeCheckYear[data.listSafeCheckYear.length - 1], - "data.listSafeCheckYeardata.listSafeCheckYear" - ); var colorList = [ "#47A2FF ", "#53C8D1",