first commit
This commit is contained in:
481
WebRoot/jsp/digitalProcess/primaryFan_SysE_Curve_SDK.jsp
Normal file
481
WebRoot/jsp/digitalProcess/primaryFan_SysE_Curve_SDK.jsp
Normal file
@ -0,0 +1,481 @@
|
||||
<%@ page language="java" pageEncoding="UTF-8" %>
|
||||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
|
||||
<%@ page import="com.sipai.entity.base.ServerObject" %>
|
||||
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security" %>
|
||||
<%String contextPath = request.getContextPath();%>
|
||||
<!DOCTYPE html>
|
||||
<!-- <html lang="zh-CN"> -->
|
||||
<!-- BEGIN HEAD -->
|
||||
<head>
|
||||
<title><%= ServerObject.atttable.get("TOPTITLE")%>
|
||||
</title>
|
||||
|
||||
<!-- 引用页头及CSS页-->
|
||||
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
||||
<style type="text/css">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
|
||||
let TypeSt = '0';
|
||||
|
||||
$(function () {
|
||||
if ('${param.unitId}' != '') {
|
||||
bizid = '${param.unitId}';
|
||||
} else {
|
||||
bizid = unitId;
|
||||
}
|
||||
getData();
|
||||
})
|
||||
|
||||
let chart1Series = [];
|
||||
chart1Series.push({
|
||||
name: '45Hz',
|
||||
data: [
|
||||
[12500, 29.86350247],
|
||||
[13000, 29.80376419],
|
||||
[13500, 29.73451166],
|
||||
[14000, 29.65574487],
|
||||
[14500, 29.56746383],
|
||||
[15000, 29.46966853],
|
||||
[15500, 29.36235898],
|
||||
[16000, 29.24553517],
|
||||
[16500, 29.1191971],
|
||||
[17000, 28.98334478],
|
||||
[17500, 28.83797821],
|
||||
[18000, 28.68309738],
|
||||
[18500, 28.51870229],
|
||||
[19000, 28.34479295],
|
||||
[19500, 28.16136935],
|
||||
[20000, 27.9684315],
|
||||
[20500, 27.76597939],
|
||||
[21000, 27.55401303],
|
||||
[21500, 27.33253241],
|
||||
[22000, 27.10153754],
|
||||
[22500, 26.86102841],
|
||||
[23000, 26.61100503],
|
||||
[23500, 26.35146739],
|
||||
[24000, 26.0824155],
|
||||
[24500, 25.80384935]
|
||||
],
|
||||
type: 'line',
|
||||
endLabel: {
|
||||
show: true,
|
||||
color: '#FFFFFF',
|
||||
formatter: '{a}'
|
||||
}
|
||||
})
|
||||
chart1Series.push({
|
||||
name: '40Hz',
|
||||
data: [
|
||||
[11000, 23.60647936],
|
||||
[11500, 23.55496438],
|
||||
[12000, 23.49393514],
|
||||
[12500, 23.42339165],
|
||||
[13000, 23.3433339],
|
||||
[13500, 23.25376189],
|
||||
[14000, 23.15467564],
|
||||
[14500, 23.04607512],
|
||||
[15000, 22.92796035],
|
||||
[15500, 22.80033133],
|
||||
[16000, 22.66318805],
|
||||
[16500, 22.51653051],
|
||||
[17000, 22.36035872],
|
||||
[17500, 22.19467268],
|
||||
[18000, 22.01947238],
|
||||
[18500, 21.83475782],
|
||||
[19000, 21.64052901],
|
||||
[19500, 21.43678594],
|
||||
[20000, 21.22352862],
|
||||
[20500, 21.00075704],
|
||||
[21000, 20.76847121],
|
||||
[21500, 20.52667112]
|
||||
],
|
||||
type: 'line',
|
||||
endLabel: {
|
||||
show: true,
|
||||
color: '#FFFFFF',
|
||||
formatter: '{a}'
|
||||
}
|
||||
})
|
||||
chart1Series.push({
|
||||
name: '35Hz',
|
||||
data: [
|
||||
[9000, 18.11741915],
|
||||
[9500, 18.08364172],
|
||||
[10000, 18.04035003],
|
||||
[10500, 17.98754409],
|
||||
[11000, 17.92522389],
|
||||
[11500, 17.85338944],
|
||||
[12000, 17.77204073],
|
||||
[12500, 17.68117777],
|
||||
[13000, 17.58080055],
|
||||
[13500, 17.47090908],
|
||||
[14000, 17.35150335],
|
||||
[14500, 17.22258337],
|
||||
[15000, 17.08414913],
|
||||
[15500, 16.93620063],
|
||||
[16000, 16.77873788],
|
||||
[16500, 16.61176088],
|
||||
[17000, 16.43526962],
|
||||
[17500, 16.2492641],
|
||||
[18000, 16.05374433]
|
||||
],
|
||||
type: 'line',
|
||||
endLabel: {
|
||||
show: true,
|
||||
color: '#FFFFFF',
|
||||
formatter: '{a}'
|
||||
}
|
||||
})
|
||||
|
||||
let chart2Series = [];
|
||||
|
||||
|
||||
function getData() {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: ext.contextPath + "/digitalProcess/digitalTechnologist/getSDKJspData.do",
|
||||
dataType: 'json',
|
||||
data: {
|
||||
unitId: bizid,
|
||||
jspId: 'primaryFanSysECurveSDK',
|
||||
modelType: '0',
|
||||
// time: $('#dateTime').val()
|
||||
},
|
||||
async: true,
|
||||
error: function () {
|
||||
return false;
|
||||
},
|
||||
success: function (data) {
|
||||
if (data.length > 0) {
|
||||
console.log(data)
|
||||
let chart1Series_scatter = [];
|
||||
chart2Series = [];
|
||||
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let content = data[i];
|
||||
if (content.getValueType == 'getRedisData') {
|
||||
let redisValue = eval("(" + content.value + ")");
|
||||
// console.log(redisValue)
|
||||
let outValue = redisValue.mpvalue;
|
||||
if (content.visualCacheData != null) {
|
||||
if (content.visualCacheData.numtail != null) {
|
||||
outValue = Number(outValue).toFixed(Number(content.visualCacheData.numtail));
|
||||
}
|
||||
}
|
||||
if (content.elementCode == 'chart1') {
|
||||
chart1Series_scatter.push(Number(outValue));
|
||||
}
|
||||
} else if (content.getValueType == 'getDayHistory') {
|
||||
|
||||
// chart2Series.push({
|
||||
// name: content.name,
|
||||
// type: 'line',
|
||||
// symbol: 'none',
|
||||
// data: content.jsonArray
|
||||
// })
|
||||
}
|
||||
}
|
||||
|
||||
let chart1SeriesData = [];
|
||||
chart1SeriesData.push(chart1Series_scatter)
|
||||
chart1Series.push({
|
||||
data: chart1SeriesData,
|
||||
type: 'scatter',
|
||||
name: ''
|
||||
})
|
||||
}
|
||||
getChart1();
|
||||
getChart2('SDKWN_MODEL1_HZ_A', 'SDKWN_MODEL1_EFF_A');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getChart1() {
|
||||
let myChart = echarts.init(document.getElementById("chart1"));
|
||||
let option = {
|
||||
backgroundColor: "#0C0C0C",
|
||||
title: {
|
||||
text: "频率",
|
||||
left: 'center',
|
||||
top: 10,
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: 14,
|
||||
fontWeight: 'normal'
|
||||
|
||||
}
|
||||
},
|
||||
// legend: {
|
||||
// data: ['45Hz', '40Hz', '35Hz'],
|
||||
// left: 'right'
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
grid: {
|
||||
left: '10px', // 与容器左侧的距离
|
||||
right: '40px', // 与容器右侧的距离
|
||||
top: '40px', // 与容器顶部的距离
|
||||
bottom: '15px', // 与容器底部的距离
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
name: 'm³/\nmin',
|
||||
type: 'value',
|
||||
min: 5000,
|
||||
max: 35000,
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
name: 'kPa',
|
||||
type: 'value',
|
||||
min: 0,
|
||||
max: 40,
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: chart1Series
|
||||
};
|
||||
myChart.setOption(option, true);
|
||||
}
|
||||
|
||||
function getChart2(mpid1, mpid2) {
|
||||
let edt = getNowTime().substring(0, 10) + " 23:59";
|
||||
let sdt = edt.substring(0, 10) + " 00:00";
|
||||
|
||||
let series = [];
|
||||
let legendName = [];
|
||||
let yUnit1 = "";
|
||||
let yUnit2 = "";
|
||||
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: ext.contextPath + "/data/getDetailData.do",
|
||||
dataType: 'json',
|
||||
data: {
|
||||
mpcode: mpid1, sdt: sdt, edt: edt
|
||||
},
|
||||
async: false,
|
||||
error: function () {
|
||||
return false;
|
||||
},
|
||||
success: function (result) {
|
||||
if (result.length > 0) {
|
||||
legendName.push(result[0].name);
|
||||
yUnit1 = result[0].unit;
|
||||
series.push({
|
||||
name: result[0].name,
|
||||
data: result[0].data,
|
||||
type: 'scatter'
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: ext.contextPath + "/data/getDetailData.do",
|
||||
dataType: 'json',
|
||||
data: {
|
||||
mpcode: mpid2, sdt: sdt, edt: edt
|
||||
},
|
||||
async: false,
|
||||
error: function () {
|
||||
return false;
|
||||
},
|
||||
success: function (result) {
|
||||
if (result.length > 0) {
|
||||
legendName.push(result[0].name);
|
||||
yUnit2 = result[0].unit;
|
||||
series.push({
|
||||
name: result[0].name,
|
||||
data: result[0].data,
|
||||
type: 'scatter'
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById("chart2").removeAttribute("_echarts_instance_");
|
||||
let myChart = echarts.init(document.getElementById("chart2"));
|
||||
let option = {
|
||||
backgroundColor: "#0C0C0C",
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: legendName,
|
||||
top: '5px',
|
||||
right: '0px',
|
||||
icon: 'circle',
|
||||
textStyle: {
|
||||
color: '#FFFFFF'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '10px', // 与容器左侧的距离
|
||||
right: '30px', // 与容器右侧的距离
|
||||
top: '40px', // 与容器顶部的距离
|
||||
bottom: '15px', // 与容器底部的距离
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
name: yUnit1,
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: yUnit2,
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed'
|
||||
}
|
||||
},
|
||||
position: 'right'
|
||||
}
|
||||
],
|
||||
series: series
|
||||
};
|
||||
myChart.setOption(option, true);
|
||||
}
|
||||
|
||||
function changeType(st) {
|
||||
TypeSt = st;
|
||||
if (st == '0') {
|
||||
$('#Type0').css("border-bottom", "2px solid #00CBFF");
|
||||
$('#Type0').css("color", "#00CBFF");
|
||||
|
||||
$('#Type1').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type1').css("color", "#ffffff");
|
||||
$('#Type2').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type2').css("color", "#ffffff");
|
||||
getChart2('SDKWN_MODEL1_HZ_A', 'SDKWN_MODEL1_EFF_A');
|
||||
} else if (st == '1') {
|
||||
$('#Type1').css("border-bottom", "2px solid #00CBFF");
|
||||
$('#Type1').css("color", "#00CBFF");
|
||||
|
||||
$('#Type0').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type0').css("color", "#ffffff");
|
||||
$('#Type2').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type2').css("color", "#ffffff");
|
||||
getChart2('V401A_HZ', 'V401A_Current');
|
||||
} else if (st == '2') {
|
||||
$('#Type2').css("border-bottom", "2px solid #00CBFF");
|
||||
$('#Type2').css("color", "#00CBFF");
|
||||
|
||||
$('#Type0').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type0').css("color", "#ffffff");
|
||||
$('#Type1').css("border-bottom", "0px solid #00CBFF");
|
||||
$('#Type1').css("color", "#ffffff");
|
||||
getChart2('V401A_HZ', 'FT_V401A_PV');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
|
||||
<div id="mainAlertdiv"></div>
|
||||
<div id="subDiv"></div>
|
||||
|
||||
<div id="main"
|
||||
style="width: 978px;height: 339px;background:rgba(0,17,33,0.80);">
|
||||
<div style="float: left;width: 50%;height: 100%;">
|
||||
<div style="float:left;width: 100%;height: 60px;padding-top: 20px;">
|
||||
<div style="float:left;width: 120px;height: 32px;background: rgba(42,122,255,0.00);color: #ffffff;line-height: 32px;padding-left:20px;background:url(<%=request.getContextPath()%>/IMG/digitalProcess/titleStyle2.png);background-size: 100% 100%;">
|
||||
风机特性曲线
|
||||
</div>
|
||||
</div>
|
||||
<div style="float:left;width: 100%;height: calc(100% - 60px);padding: 10px;">
|
||||
<div id="chart1" style="float:left;width: 100%;height:100%;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="float: left;width: 50%;height: 100%;">
|
||||
<div style="float:left;width: 100%;height: 60px;padding-top: 20px;">
|
||||
<div style="float: left;height: 100%;">
|
||||
<div id="Type0"
|
||||
style="float: left;border-bottom: 2px solid #00CBFF;width:75px;height: 30px;font-size: 13px;text-align: center;color: #00CBFF;cursor: pointer;"
|
||||
onclick="changeType('0');">频率与效率
|
||||
</div>
|
||||
<div id="Type1"
|
||||
style="float: left;width:75px;height: 30px;font-size: 13px;text-align: center;color: #ffffff;margin-left: 20px;cursor: pointer;"
|
||||
onclick="changeType('1');">频率与电流
|
||||
</div>
|
||||
<div id="Type2"
|
||||
style="float: left;width:75px;height: 30px;font-size: 13px;text-align: center;color: #ffffff;margin-left: 20px;cursor: pointer;"
|
||||
onclick="changeType('2');">频率与风量
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="float:left;width: 100%;height: calc(100% - 60px);padding: 10px;">
|
||||
<div id="chart2" style="float:left;width: 100%;height:100%;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
<!-- 引入daterangepicker-->
|
||||
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.css"/>
|
||||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
|
||||
charset="utf-8"></script>
|
||||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.js"
|
||||
charset="utf-8"></script>
|
||||
</html>
|
||||
Reference in New Issue
Block a user