1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342 |
- <!DOCTYPE html>
- <html class="x-admin-sm">
- <head>
- <meta charset="UTF-8">
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport"
- content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
- <link rel="shortcut icon" href="https://osscold.baozhida.cn/favicon.ico">
- <link rel="bookmark" href="https://osscold.baozhida.cn/favicon.ico">
- <link rel="stylesheet" href="https://osscold.baozhida.cn/css/font.css">
- <link rel="stylesheet" href="https://osscold.baozhida.cn/css/xadmin.css">
- <script src="https://osscold.baozhida.cn/js/jquery.min.js"></script>
- <script src="https://osscold.baozhida.cn/js/jquery.cookie.min.js"></script>
- <script src="https://osscold.baozhida.cn/lib/layui/layui.js" charset="utf-8"></script>
- <script src="https://osscold.baozhida.cn/js/echarts.js" charset="utf-8"></script>
- <script type="text/javascript" src="https://osscold.baozhida.cn/js/xadmin.js"></script>
- </head>
- <body>
- <div class="x-nav">
- <span class="layui-breadcrumb">
- <a href="">首页</a>
- <a><cite>宝智达</cite></a>
- </span>
- <a class="layui-btn layui-btn-normal" style="line-height:1.6em;margin-top:3px;float:right"
- onclick="location.reload()" title="刷新">
- <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
- </a>
- </div>
- <div class="layui-fluid">
- <div class="layui-row">
- <!-- // 传感器 选择-->
- <div style="width: 395px;float: left">
- <div class="layui-card">
- <div class="layui-card-body ">
- <form class="layui-form layui-col-space5" οnsubmit="return false;">
- <div class="layui-input-inline layui-show-xs-block">
- <input value="" type="text" id="D_T_sn" name="D_T_sn" placeholder="请输入 SN"
- autocomplete="off"
- class="layui-input"></div>
- <div class="layui-input-inline layui-show-xs-block">
- <input value="" type="text" id="D_Name" name="D_Name" placeholder="请输入 传感器名称"
- autocomplete="off"
- class="layui-input"></div>
- <div class="layui-input-inline layui-show-xs-block">
- <select id="Class_1" name="Class_1">
- <option value=0>所有分类</option>
- {{range $index, $elem := .Class_List}}
- <option value={{$elem.Id}}>{{$elem.T_name}}
- </option>
- {{end}}
- </select>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="get_DeviceSensor_list(0)">
- <i class="layui-icon"></i></div>
- </div>
- </form>
- <hr>
- </div>
- <div class="layui-card-body " style="margin-top: -20px">
- <div id="DeviceSensor_list" style="width: 98%; overflow: hidden;max-height: 616px;overflow-y: auto">
- <div style="color: #1E9FFF;text-align: center;font-size: 15px;margin-top: 150px">加载中...</div>
- <!-- <div class="layui-col"-->
- <!-- style="height: 52px;background-color: #fafafa;border-radius:5px;padding-top: 2px;">-->
- <!-- <img style="float: left;width: 50px;margin: 0px 10px" src="https://osscold.baozhida.cn/images/温湿度传感器-1.png"-->
- <!-- height="50"-->
- <!-- width="40"/>-->
- <!-- <div style="float: left;">-->
- <!-- <div style="margin-top: 4px;font-size: 14px">士大夫撒地方递四方速递</div>-->
- <!-- <div style="margin-top: -3px;font-size: 12px">SN:KF20210510143443 [1]</div>-->
- <!-- </div>-->
- <!-- <div class="layui-card-header"-->
- <!-- style="float: right;padding-left: 0px;padding-top: 6px;color: #1E9FFF">-->
- <!-- 》-->
- <!-- </div>-->
- <!-- </div>-->
- </div>
- </div>
- <div class="layui-card-body ">
- <div style="height: 70px">
- <div class="layui-card-body " style="text-align: center">
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="Checkboxs_All()">
- <i class="layui-icon">全选择</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="Checkboxs_Allno()">
- <i class="layui-icon">全取消</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="Checkboxs_Allto()">
- <i class="layui-icon">反选</i>
- </div>
- </div>
- <div style="color: #1E9FFF;text-align: center" id="DeviceSensor_list_Pages_x"></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <!-- // 传感器 选择-->
- <div style="width: calc(100% - 395px);float: left">
- <div class="layui-card">
- <div class="layui-card-body ">
- <form class="layui-form layui-col-space5" οnsubmit="return false;">
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_1()">
- <i class="layui-icon">今天</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_2()">
- <i class="layui-icon">近3天</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_3()">
- <i class="layui-icon">近5天</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_4()">
- <i class="layui-icon">近7天</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- 自定义时间:
- </div>
- <div class="layui-inline layui-show-xs-block">
- <input class="layui-input" autocomplete="off" placeholder="开始日" name="Time_start" id="Time_start" lay-key="1"></div>
- <div class="layui-inline layui-show-xs-block">
- <input class="layui-input" autocomplete="off" placeholder="截止日" name="Time_end" id="Time_end" lay-key="2"></div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="get_DeviceSensor_data_M()">
- <i class="layui-icon"></i>
- </div>
- </div>
- </form>
- <hr>
- </div>
- <div class="layui-card-body " >
- <div style="width: 99%;height:35px;">
- <h2 id="T_myChart_time" style="text-align: center"></h2>
- </div>
- <div id="T_myChart_1" style="width: 99%;height:335px;"></div>
- <div style="width: 99%;height:35px;">
- <h3 id="T_myChart_1_title" style="text-align: center;color: #0bace6;"></h3>
- </div>
- <div id="T_myChart_2" style="width: 99%;height:335px;"></div>
- <div style="width: 99%;height:35px;">
- <h3 id="T_myChart_2_title" style="text-align: center;color: #0bace6;"></h3>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </body>
- <script>
- //获取GET
- function getPar(par) {
- //获取当前URL
- var local_url = document.location.href;
- //获取要取得的get参数位置
- var get = local_url.indexOf(par + "=")
- ;
- if (get == -1) {
- return false;
- }
- //截取字符串
- //截取字符串
- var get_par = local_url.slice(par.length + get + 1);
- //判断截取后的字符串是否还有其他get参数
- var nextPar = get_par.indexOf("&")
- ;
- if (nextPar != -1) {
- get_par = get_par.slice(0, nextPar);
- }
- return get_par;
- }
- layui.use(['laydate', 'form'],
- function () {
- var laydate = layui.laydate;
- //执行一个laydate实例
- laydate.render({
- elem: '#Time_start' //指定元素
- ,type: 'datetime'
- });
- //执行一个laydate实例
- laydate.render({
- elem: '#Time_end' //指定元素
- ,type: 'datetime'
- });
- });
- var T_name = ""
- var T_sn = ""
- var T_class_id = 0
- var Admin_rh = "{{$.Admin_r.Admin_rh}}"
- var T_id = 0
- var T_sn_T_id = ""
- var Time_start = ""
- var Time_end = ""
- var DeviceSensor_snid_list = ""
- var DeviceSensor_lite = []
- var DeviceSensor_data = []
- /// --------------- 传感器列表
- // 页面 加载完成后执行
- window.onload = function () {
- console.log("页面 加载完成后执行")
- quick_1()
- get_DeviceSensor_list(0)
- }
- function ChangeDiv(e) {
- var divs = document.getElementsByClassName("ChangeDiv");
- var len = divs.length;
- for(var i=0;i<len;i++){
- divs[i].style.border = "1px solid #ffffff";
- }
- e.parentNode.style.border = "1px solid #ed0000";
- get_DeviceSensor_data_M()
- }
- // 今天
- function quick_1() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_start").val(Time_start)
- $("#Time_end").val(Time_end)
- get_DeviceSensor_data_M()
- }
- // 近一周
- function quick_2() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 2);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data_M()
- }
- // 近一月
- function quick_3() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 4);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data_M()
- }
- // 近一季度
- function quick_4() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 6);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data_M()
- }
- //获取div中所有的复选框 .value
- var checkboxs = document.getElementsByClassName("checkboxxx");
- function Checkboxs_All () {
- for(var i = 0;i < checkboxs.length; i++){
- checkboxs[i].checked = true
- }
- }
- function Checkboxs_Allno () {
- for(var i = 0;i < checkboxs.length; i++){
- checkboxs[i].checked = false
- }
- }
- function Checkboxs_Allto () {
- for(var i = 0;i < checkboxs.length; i++){
- if(checkboxs[i].checked){
- checkboxs[i].checked = false
- }else {
- checkboxs[i].checked = true
- }
- }
- }
- function Checkboxs_GetAll () {
- DeviceSensor_snid_list = ""
- for(var i = 0;i < checkboxs.length; i++){
- if(checkboxs[i].checked){
- DeviceSensor_snid_list = DeviceSensor_snid_list + checkboxs[i].value + "|"
- }
- }
- }
- function get_DeviceSensor_list(page) {
- T_sn = $("#D_T_sn").val();
- T_name = $("#D_Name").val();
- T_class_id = $("#Class_1").val();
- $.ajax({
- type: 'POST',
- url: 'Device_Sensor_List',//发送请求
- data: {
- User_tokey: $.cookie("User_tokey"),
- T_sn: T_sn,
- T_name: T_name,
- T_class_id: parseInt(T_class_id),
- page: page,
- page_z: 100,
- },
- success: function (result) {
- console.log(result)
- if (result.Code == 200) {
- if(page == 0)
- $('#DeviceSensor_list').html("")
- // $('#DeviceSensor_list_Pages').html("")
- // $('#DeviceSensor_list_Pages_x').html("")
- DeviceSensor_lite = result.Data.DeviceSensor_lite
- if (DeviceSensor_lite.length == 0) {
- $('#DeviceSensor_list').html("<div style=\"color: #1E9FFF;text-align: center;font-size: 15px;margin-top: 150px\">没有设备</div>")
- return
- }
- Add_DeviceSensor_list(result.Data.DeviceSensor_lite) // 列表
- // Add_DeviceSensor_list_Pages(result.Data.Pages) // 分页
- $('#DeviceSensor_list_Pages_x').html(" 传感器 总数:" + result.Data.Num);
- if(result.Data.Page_size > result.Data.Page ){
- get_DeviceSensor_list(result.Data.Page+1)
- }
- } else {
- }
- }
- });
- return false
- }
- function Add_DeviceSensor_list(DS_lite) {
- for (let i = 0; i < DS_lite.length; i++) {
- // if(T_id == 0){
- // T_id = DS_lite[i].T_id;
- // T_sn_T_id = DS_lite[i].T_sn;
- // T_name = DS_lite[i].T_name;
- // // get_DeviceSensor_data(0)
- // }
- //
- $('#DeviceSensor_list').append("" +
- "<div class=\"layui-col ChangeDiv\" \n" +
- " style=\"border: 1px solid #ffffff;height: 52px;background-color: #fafafa;border-radius:5px;padding-top: 2px;margin-top: 6px;\">\n" +
- " <input type=\"checkbox\" name='checkboxxx' class='checkboxxx' onclick='get_DeviceSensor_data_M()' value='" + DS_lite[i].T_sn + "," + DS_lite[i].T_id + "' style='float: left;width: 18px;height: 18px;margin-top: 16px;margin-left: 10px;'/>" +
- " <img style=\"float: left;width: 50px;margin: 0px 10px\" src=\"https://osscold.baozhida.cn/images/温湿度传感器-1.png\"\n" +
- " height=\"50\"\n" +
- " width=\"40\"/>\n" +
- " <div style=\"float: left;\" >\n" +
- " <div style=\"margin-top: 4px;font-size: 14px;height: 24px;\">" + DS_lite[i].T_name + "</div>\n" +
- " <div style=\"margin-top: -3px;font-size: 12px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 200px;\">SN:" + DS_lite[i].T_sn + " [" + DS_lite[i].T_id + "]</div>\n" +
- " </div>\n" +
- " <div class=\"layui-card-header\" style=\"float: right;padding-left: 0px;padding-top: 6px;color: #1E9FFF\">\n" +
- " \n" +
- " </div>\n" +
- " </div>")
- }
- }
- function get_DeviceSensor_data(page) {
- if($("#Time_start").val().length > 0){
- Time_start = $("#Time_start").val();
- }else {
- Time_start = ""
- }
- if($("#Time_end").val().length > 0){
- Time_end = $("#Time_end").val();
- }else {
- Time_end = ""
- }
- if(T_sn_T_id.length == 0){
- return ;
- }
- $("#T_myChart_time").html(T_name+"["+T_id+"]:" + $("#Time_start").val() + '~' + $("#Time_end").val())
- $.ajax({
- type: 'POST',
- url: 'Device_Sensor_Data',//发送请求
- data: {
- User_tokey: $.cookie("User_tokey"),
- Time_start:Time_start,
- Time_end:Time_end,
- T_sn: T_sn_T_id,
- T_id: T_id,
- page: 0,
- page_z: 9000,
- },
- success: function (result) {
- console.log(result)
- if (result.Code == 200) {
- DeviceSensor_data = result.Data.DeviceSensor_data
- console.log(result.Data.Num)
- if(result.Data.Num == 0){
- // alert("当前没有数据,请尝试一下其他时间段");
- layer.msg('当前没有数据,请尝试一下其他时间段');
- return
- }
- $("#T_myChart_2").show()
- $("#T_myChart_2_title").show()
- if(Admin_rh == 0 && T_sn_T_id.indexOf("YD") != -1){
- $("#T_myChart_2").hide()
- $("#T_myChart_2_title").hide()
- }
- T_fhand(result.Data.DeviceSensor_data)
- } else {
- }
- }
- });
- return false
- }
- function get_DeviceSensor_data_M() {
- if($("#Time_start").val().length > 0){
- Time_start = $("#Time_start").val();
- }else {
- Time_start = ""
- }
- if($("#Time_end").val().length > 0){
- Time_end = $("#Time_end").val();
- }else {
- Time_end = ""
- }
- Checkboxs_GetAll()
- $("#T_myChart_time").html($("#Time_start").val() + '~' + $("#Time_end").val())
- console.log("DeviceSensor_snid_list:",DeviceSensor_snid_list)
- // KF202201241934253,50|
- if(DeviceSensor_snid_list.length < 3) return
- DeviceSensor_snid_list_split = DeviceSensor_snid_list.split("|")
- var loading = layer.load(0, {
- shade: false,
- time: 99*1000
- });
- f_myChart_todata_inte() // 初始化数据
- for(var i = 0;i < DeviceSensor_snid_list_split.length ;i++){
- if(DeviceSensor_snid_list_split[i].length < 3) continue
- snid_split = DeviceSensor_snid_list_split[i].split(",")
- console.log("snid_split:",snid_split)
- M_T_n_max = 0
- M_T_n_min = 100
- M_T_n_ave_num = 0
- M_T_n_ave_sum = 0
- M_T_n_overtime = 0
- M_T_n_overtime_a = 0
- M_H_n_max = 0
- M_H_n_min = 100
- M_H_n_ave_num = 0
- M_H_n_ave_sum = 0
- M_H_n_overtime = 0
- M_H_n_overtime_a = 0
- $.ajax({
- type: 'POST',
- url: 'Device_Sensor_Data',//发送请求
- data: {
- User_tokey: $.cookie("User_tokey"),
- Time_start:Time_start,
- Time_end:Time_end,
- T_sn: snid_split[0],
- T_id: snid_split[1],
- page: 0,
- page_z: 9000,
- },
- success: function (result) {
- console.log(result)
- if (result.Code == 200) {
- console.log(result.Data.Num)
- if(result.Data.Num == 0){
- // alert("当前没有数据,请尝试一下其他时间段");
- layer.msg('当前没有数据,请尝试一下其他时间段');
- return
- }
- // T_fhand(result.Data.DeviceSensor_data)
- f_Data_to_myChart(result.Data.DeviceSensor_data)
- layer.close(loading)
- } else {
- }
- }
- });
- }
- return false
- }
- var T_myChart = echarts.init(document.getElementById('T_myChart_1'));
- var H_myChart = echarts.init(document.getElementById('T_myChart_2'));
- </script>
- <!-- 多个 图表-->
- <script>
- // 最高温度、最低温度、平均温度、超标温度累积时长
- var T_myChart_List_M = []
- var H_myChart_List_M = []
- function f_myChart_todata_inte() {
- T_myChart_List_M = [] // 清空
- H_myChart_List_M = [] // 清空
- T_myChart.dispose()
- H_myChart.dispose()
- $("#T_myChart_2").show()
- $("#T_myChart_2_title").show()
- T_myChart = echarts.init(document.getElementById('T_myChart_1'));
- H_myChart = echarts.init(document.getElementById('T_myChart_2'));
- $("#T_myChart_1_title").html("")
- $("#T_myChart_2_title").html("")
- }
- var M_T_n_max = 0
- var M_T_n_min = 0
- var M_T_n_ave_num = 0
- var M_T_n_ave_sum = 0
- var M_T_n_overtime = 0
- var M_T_n_overtime_a = 0
- var M_H_n_max = 0
- var M_H_n_min = 0
- var M_H_n_ave_num = 0
- var M_H_n_ave_sum = 0
- var M_H_n_overtime = 0
- var M_H_n_overtime_a = 0
- function f_Data_to_myChart(data) {
- data_1 = []
- data_2 = []
- for (let i = 0; i < data.length; i++) {
- // 温度
- data_1.unshift([data[i].T_time,data[i].T_t])
- if(data[i].T_t > M_T_n_max){
- M_T_n_max = data[i].T_t
- }
- if(data[i].T_t < M_T_n_min){
- M_T_n_min = data[i].T_t
- }
- M_T_n_ave_num += 1
- M_T_n_ave_sum += data[i].T_t
- if(data[i].T_t <= data[i].T_Tlower || data[i].T_t >= data[i].T_Tupper){
- if(M_T_n_overtime_a == 0){
- console.log(new Date(data[i].T_time),data[i].T_time)
- M_T_n_overtime_a = new Date(data[i].T_time)
- }
- }else {
- if(M_T_n_overtime_a > 0){
- M_T_n_overtime += M_T_n_overtime_a - new Date(data[i].T_time)
- M_T_n_overtime_a = 0
- }
- }
- // 湿度
- data_2.unshift([data[i].T_time,data[i].T_rh])
- if(data[i].T_rh > M_H_n_max){
- M_H_n_max = data[i].T_rh
- }
- if(data[i].T_rh < M_H_n_min){
- M_H_n_min = data[i].T_rh
- }
- M_H_n_ave_num += 1
- M_H_n_ave_sum += data[i].T_rh
- if(data[i].T_rh <= data[i].T_RHlower || data[i].T_rh >= data[i].T_RHupper){
- if(M_H_n_overtime_a == 0){
- console.log(new Date(data[i].T_time),data[i].T_time)
- M_H_n_overtime_a = new Date(data[i].T_time)
- }
- }else {
- if(M_H_n_overtime_a > 0){
- M_H_n_overtime += M_H_n_overtime_a - new Date(data[i].T_time)
- M_H_n_overtime_a = 0
- }
- }
- }
- $("#T_myChart_1_title").html("最高温度:"+M_T_n_max.toFixed(2)+"℃   最低温度"+M_T_n_min.toFixed(2)+"℃   平均温度:"+(M_T_n_ave_sum/M_T_n_ave_num).toFixed(2)+"℃   超标温度累积时长:"+formatSeconds(M_T_n_overtime/10000)+"")
- $("#T_myChart_2_title").html("最高湿度:"+M_H_n_max.toFixed(2)+"%   最低湿度"+M_H_n_min.toFixed(2)+"%   平均湿度:"+(M_H_n_ave_sum/M_H_n_ave_num).toFixed(2)+"%   超标湿度累积时长:"+formatSeconds(M_H_n_overtime/10000)+"")
- T_myChart_List_M.push({
- name: data[0].T_name,
- type: 'line',
- // stack: 'Total',
- smooth: true,
- data: data_1,
- markLine: {
- data: [
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"下限("+data[0].T_Tlower+"℃)"
- },
- yAxis:data[0].T_Tlower
- },
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"上限("+data[0].T_Tupper+"℃)"
- },
- yAxis:data[0].T_Tupper
- }
- ]
- }
- })
- H_myChart_List_M.push({
- name: data[0].T_name,
- type: 'line',
- // stack: 'Total',
- smooth: true,
- data: data_2,
- markLine: {
- data: [
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"下限("+data[0].T_RHlower+"℃)"
- },
- yAxis:data[0].T_RHlower
- },
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"上限("+data[0].T_RHupper+"℃)"
- },
- yAxis:data[0].T_RHupper
- }
- ]
- }
- })
- var T_myChart_option_1 = {
- // title: {
- // top: '50px',
- // text: T_name+"["+T_id+"]:" + $("#Time_start").val() + '~' + $("#Time_end").val(),
- // textStyle:{
- // fontSize:14,
- // }
- // },
- tooltip: {
- trigger: 'axis'
- },
- toolbox: {
- show: true,
- feature: {
- dataZoom: {
- yAxisIndex: 'none'
- },
- dataView: { readOnly: false },
- magicType: { type: ['line', 'bar'] },
- restore: {},
- saveAsImage: {}
- }
- },
- grid: {
- top: '40px',
- left: '0px',
- right: '70px',
- bottom: '50px',
- containLabel: true
- },
- legend: {
- textStyle:{
- color:"#7c7c7c"
- }
- },
- xAxis: {
- type: 'time',
- boundaryGap: false,
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value} °C'
- },
- boundaryGap: [0, '100%'],
- // max:80,
- // min:-10,
- },
- dataZoom: [
- {
- type: 'inside',
- start: 0,
- end: 100
- },
- {
- start: 0,
- end: 100
- }
- ],
- markPoint: {
- // data: [ {
- // name: '最大值',
- // type: 'max'
- // },{
- // name: '最小值',
- // type: 'min'
- // }
- // ]
- },
- series: T_myChart_List_M
- };
- // 初始化 图表
- T_myChart.setOption(T_myChart_option_1);
- var T_myChart_option_2 = {
- // title: {
- // top: '50px',
- // text: T_name+"["+T_id+"]:" + $("#Time_start").val() + '~' + $("#Time_end").val(),
- // textStyle:{
- // fontSize:14,
- // }
- // },
- tooltip: {
- trigger: 'axis'
- },
- toolbox: {
- show: true,
- feature: {
- dataZoom: {
- yAxisIndex: 'none'
- },
- dataView: { readOnly: false },
- magicType: { type: ['line', 'bar'] },
- restore: {},
- saveAsImage: {}
- }
- },
- grid: {
- top: '40px',
- left: '0px',
- right: '70px',
- bottom: '50px',
- containLabel: true
- },
- legend: {
- textStyle:{
- color:"#7c7c7c"
- }
- },
- xAxis: {
- type: 'time',
- boundaryGap: false,
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value} %'
- },
- boundaryGap: [0, '100%'],
- // max:100,
- // min:0,
- },
- dataZoom: [
- {
- type: 'inside',
- start: 0,
- end: 100
- },
- {
- start: 0,
- end: 100
- }
- ],
- markPoint: {
- // data: [ {
- // name: '最大值',
- // type: 'max'
- // },{
- // name: '最小值',
- // type: 'min'
- // }
- // ]
- },
- series: H_myChart_List_M
- };
- // 初始化 图表
- H_myChart.setOption(T_myChart_option_2);
- }
-
-
- //
- // function f_Refresh_T_myChart_1() {
- // T_myChart_1.clear();
- // //
- // // T_myChart_option_1.title.text =
- // T_myChart_option_1.series = T_myChart_List_1
- // T_myChart_option_1.yAxis.max = T_myChart_max_1
- // T_myChart_option_1.yAxis.min = T_myChart_min_1
- // T_myChart_option_1.yAxis.axisLabel.formatter = '{value} ℃'
- // T_myChart_1.setOption(T_myChart_option_1);
- // }
- </script>
- <!-- 单个 图表-->
- <script>
- function T_fhand(data) {
- T_myChart.dispose()
- H_myChart.dispose()
- T_myChart = echarts.init(document.getElementById('T_myChart_1'));
- H_myChart = echarts.init(document.getElementById('T_myChart_2'));
- var T_time = []
- var T_data = []
- var T_waring = []
- var T_Tlower = 0
- var T_Tupper = 0
- var T_max = -999
- var T_min = 999
- var T_n_max = 0
- var T_n_min = 0
- var T_n_ave_num = 0
- var T_n_ave_sum = 0
- var T_n_overtime = 0
- var T_n_overtime_a = 0
- var H_time = []
- var H_data = []
- var H_waring = []
- var H_Tlower = 0
- var H_Tupper = 0
- var H_max = 0
- var H_min = 99
- var H_n_max = 0
- var H_n_min = 0
- var H_n_ave_num = 0
- var H_n_ave_sum = 0
- var H_n_overtime = 0
- var H_n_overtime_a = 0
- T_Tlower = data[0].T_Tlower
- T_Tupper = data[0].T_Tupper
- H_Tlower = data[0].T_RHlower
- H_Tupper = data[0].T_RHupper
- var dataZoomstart = 0 //缩放比例
- dataZoomstart = 100 - (30 / (data.length / 100))
- for (let i = 0; i < data.length; i++) {
- // 温度
- T_time.unshift(data[i].T_time)
- T_data.unshift(data[i].T_t)
- if(data[i].T_t > T_max){
- T_max = data[i].T_t
- T_n_max = data[i].T_t
- }
- if(data[i].T_t < T_min){
- T_min = data[i].T_t
- T_n_min = data[i].T_t
- }
- T_n_ave_num += 1
- T_n_ave_sum += data[i].T_t
- if(data[i].T_t <= data[i].T_Tlower || data[i].T_t >= data[i].T_Tupper){
- T_waring.unshift({ name: '周最低', value: data[i].T_t, xAxis: data.length-i-1, yAxis: data[i].T_t })
- if(T_n_overtime_a == 0){
- console.log(new Date(data[i].T_time),data[i].T_time)
- T_n_overtime_a = new Date(data[i].T_time)
- }
- }else {
- if(T_n_overtime_a > 0){
- T_n_overtime += T_n_overtime_a - new Date(data[i].T_time)
- T_n_overtime_a = 0
- }
- }
- // 湿度
- H_time.unshift(data[i].T_time)
- H_data.unshift(data[i].T_rh)
- if(data[i].T_rh > H_max){
- H_max = data[i].T_rh
- H_n_max = data[i].T_rh
- }
- if(data[i].T_rh < H_min){
- H_min = data[i].T_rh
- H_n_min = data[i].T_rh
- }
- if(data[i].T_rh <= data[i].T_RHlower || data[i].T_rh >= data[i].T_RHupper){
- H_waring.unshift({ name: '周最低', value: data[i].T_rh, xAxis: data.length-i-1, yAxis: data[i].T_rh })
- if(H_n_overtime_a == 0){
- console.log(new Date(data[i].T_time),data[i].T_time)
- H_n_overtime_a = new Date(data[i].T_time)
- }
- }else {
- if(H_n_overtime_a > 0){
- H_n_overtime += H_n_overtime_a - new Date(data[i].T_time)
- H_n_overtime_a = 0
- }
- }
- H_n_ave_num += 1
- H_n_ave_sum += data[i].T_rh
- }
- $("#T_myChart_1_title").html("最高温度:"+T_n_max.toFixed(2)+"℃   最低温度"+T_n_min.toFixed(2)+"℃   平均温度:"+(T_n_ave_sum/T_n_ave_num).toFixed(2)+"℃   超标温度累积时长:"+formatSeconds(T_n_overtime/10000)+"")
- $("#T_myChart_2_title").html("最高湿度:"+H_n_max.toFixed(2)+"%   最低湿度"+H_n_min.toFixed(2)+"%   平均湿度:"+(H_n_ave_sum/H_n_ave_num).toFixed(2)+"%   超标湿度累积时长:"+formatSeconds(H_n_overtime/10000)+"")
- console.log("T_max:",T_max,"T_min:",T_min)
- if(T_Tupper > T_max){
- T_max = T_Tupper
- }
- if(T_Tlower < T_min){
- T_min = T_Tlower
- }
- T_max += 1
- T_min -= 1
- console.log("H_max:",H_max,"H_min:",H_min)
- if(H_Tupper > H_max){
- H_max = H_Tupper
- }
- if(H_Tlower < H_min){
- H_min = H_Tlower
- }
- H_max += 1
- H_min -= 1
- T_option = {
- title: {
- text: T_name+"["+T_id+"]:" + $("#Time_start").val() + '~' + $("#Time_end").val(),
- textStyle:{
- fontSize:14,
- }
- },
- tooltip: {
- trigger: 'axis'
- },
- legend: {},
- toolbox: {
- show: true,
- feature: {
- dataZoom: {
- yAxisIndex: 'none'
- },
- dataView: { readOnly: false },
- magicType: { type: ['line', 'bar'] },
- restore: {},
- saveAsImage: {}
- }
- },
- grid: {
- top: '40px',
- left: '0px',
- right: '70px',
- bottom: '50px',
- containLabel: true
- },
- xAxis: {
- type: 'category',
- boundaryGap: false,
- data: T_time, //['1', '2', '3', '4', '5', '6', '7'],
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value} °C'
- },
- max:T_max,
- min:T_min,
- },
- dataZoom: [
- {
- type: 'inside',
- start: 0,
- end: 100
- },
- {
- start: 0,
- end: 100
- }
- ],
- series: [
- {
- // name: '温度',
- type: 'line',
- data: T_data, //[1, -2, -1, 5, 3, 2, 0],
- markPoint: {
- data: T_waring,
- // [
- // { name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }
- // ,{ name: '周最低', value: -1, xAxis: 2, yAxis: -1 }
- // ]
- },
- markLine: {
- data: [
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"下限("+T_Tlower+"℃)"
- },
- yAxis:T_Tlower
- },
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"上限("+T_Tupper+"℃)"
- },
- yAxis:T_Tupper
- }
- ]
- }
- },
- ]
- };
- T_myChart.setOption(T_option);
- H_option = {
- title: {
- text: T_name+"["+T_id+"]:" + $("#Time_start").val() + '~' + $("#Time_end").val(),
- textStyle:{
- fontSize:14,
- }
- },
- tooltip: {
- trigger: 'axis'
- },
- legend: {},
- toolbox: {
- show: true,
- feature: {
- dataZoom: {
- yAxisIndex: 'none'
- },
- dataView: { readOnly: false },
- magicType: { type: ['line', 'bar'] },
- restore: {},
- saveAsImage: {}
- }
- },
- grid: {
- top: '40px',
- left: '0px',
- right: '70px',
- bottom: '50px',
- containLabel: true
- },
- xAxis: {
- type: 'category',
- boundaryGap: false,
- data: H_time, //['1', '2', '3', '4', '5', '6', '7'],
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value} %'
- },
- max:H_max,
- min:H_min,
- },
- dataZoom: [
- {
- type: 'inside',
- start: 0,
- end: 100
- },
- {
- start: 0,
- end: 100
- }
- ],
- series: [
- {
- // name: '湿度',
- type: 'line',
- data: H_data, //[1, -2, -1, 5, 3, 2, 0],
- markPoint: {
- data: H_waring,
- // [
- // { name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }
- // ,{ name: '周最低', value: -1, xAxis: 2, yAxis: -1 }
- // ]
- },
- markLine: {
- data: [
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"下限("+H_Tlower+"%)"
- },
- yAxis:H_Tlower
- },
- {
- silent:true, //鼠标悬停事件 true没有,false有
- lineStyle:{ //警戒线的样式 ,虚实 颜色
- type:"solid",
- color:"#FF4200",
- width: 3,
- },
- label:{
- position:'end',
- formatter:"上限("+H_Tupper+"%)",
- },
- yAxis:H_Tupper
- }
- ]
- }
- }
- ]
- };
- H_myChart.setOption(H_option);
- }
- function formatSeconds(value) {
- var theTime = parseInt(value);// 秒
- var theTime1 = 0;// 分
- var theTime2 = 0;// 小时
- // alert(theTime);
- if(theTime > 60) {
- theTime1 = parseInt(theTime/60);
- theTime = parseInt(theTime%60);
- // alert(theTime1+"-"+theTime);
- if(theTime1 > 60) {
- theTime2 = parseInt(theTime1/60);
- theTime1 = parseInt(theTime1%60);
- }
- }
- var result = ""+parseInt(theTime)+"秒";
- if(theTime1 > 0) {
- result = ""+parseInt(theTime1)+"分"+result;
- }
- if(theTime2 > 0) {
- result = ""+parseInt(theTime2)+"小时"+result;
- }
- return result;
- }
- </script>
- </html>
|