喷煤趋势报警,趋势轴样式修改完成

This commit is contained in:
dell
2023-08-22 17:24:56 +08:00
parent 2587fe7fa3
commit a83653655b
13 changed files with 2120 additions and 97 deletions

View File

@ -532,7 +532,12 @@
return chardatalist;
}
//true
//false
//第一条Y轴是否显示轴线
const oneAxisLineShow = true;
//其他Y轴是否显示轴线
const otherAxisLineShow = false;
showchart = async function () {
//(document.getElementById('echarts-records'), 'walden');
@ -562,9 +567,21 @@
var xDataArr = new Array();
var yDataArr = new Array();
var maxArr = new Array();
var minArr = new Array();
var intervalArr = new Array();
for (var listindex = 0; listindex < chardatalist.length; listindex++) {
let ydata = chardatalist[listindex].map(x => { return x.value });
let xdata = chardatalist[listindex].map(x => { return x.name });
debugger;
let maxSrc = Math.max.apply(null, ydata);
let newMax = Math.ceil(maxSrc / 5) * 5;
maxArr.push(newMax);
let minSrc = Math.min.apply(null, ydata);
let newMin = Math.floor(minSrc / 5) * 5
minArr.push(newMin);
let interval = (newMax - newMin) / 5
intervalArr.push(interval);
xDataArr.push(xdata);
yDataArr.push(ydata);
}
@ -591,32 +608,37 @@
let yAxisdata = {
name: JSON.parse(JSON.stringify(unitnames[ci])),
nameLocation: 'center',
nameGap:5,
nameRotate:270,
max: maxArr[ci],
min: minArr[ci],
interval: intervalArr[ci],
//splitNumber:21,
type: 'value',
//position:'left',
//坐标轴两边留白策略设置max、min后失效
boundaryGap: ['5%', '2%'],
// max: 700,
// min: 0,
// 让表格的刻度向靠里侧显示
axisTick: {
show: true,
inside: true
inside: false,
length: 9,
},
minorTick:{
show:true,
length: 7,
length: 5,
},
minorSplitLine: {
show: true,
},
axisLabel: {
inside: true,
align: 'left',
inside: false,
align: 'right',
verticalAlign: 'bottom',
},
// 设置刻度线的颜色等样式
axisLine: {
show: true,
show: oneAxisLineShow,
onZero: true,
onZeroAxisIndex:0,
lineStyle: {
@ -641,8 +663,12 @@
let yAxisdata = {
name: JSON.parse(JSON.stringify(unitnames[ci])),
nameLocation: 'center',
// max: 800,
// min: 0,
nameGap: 5,
nameRotate: 270,
max: maxArr[ci],
min: minArr[ci],
interval: intervalArr[ci],
//splitNumber: 21,
type: 'value',
position: 'left',
//坐标轴两边留白策略设置max、min后失效
@ -650,22 +676,23 @@
//alignTicks:true,
axisTick: {
show:true,
inside: true
},
minorTick: {
show: true,
length: 7,
inside: false,
length: 9,
},
//minorTick: {
// show: true,
// length: 5,
//},
minorSplitLine:{
show:true,
},
axisLabel: {
inside: true,
align: 'left',
inside: false,
align: 'right',
verticalAlign: 'bottom',
},
axisLine: {
show: true,
show: otherAxisLineShow,
onZero: false,
lineStyle: {
//color: color[ci],
@ -674,7 +701,7 @@
}
},
splitLine: {
show: false //想要不显示网格线改为false
show: true //想要不显示网格线改为false
},
// 设置坐标轴偏移位置
offset: (ci) * 40
@ -919,6 +946,7 @@
<body style="height:100%">
<script type="text/javascript" src="~/lib/echarts-5.3.0/dist/echarts.js"></script>
<div class="layui-fluid" style="padding:0 0px;height:100%">
<div class="layui-row layui-col-space5" style="height:100%">
<div class="layui-col-md2 layui-col-xs3" style="height:100%;padding-right:12px;">