| | |
| | | <meta charset="utf-8"> |
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
| | | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"> |
| | | <title>华星智控定位管理系统 </title> |
| | | <title>切换地图</title> |
| | | <link rel="icon" type="image/x-icon" href="/hxzkoa/hxzk/assets/img/favicon.ico" /> |
| | | <link href="/hxzkoa/hxzk/assets/css/loader.css" rel="stylesheet" type="text/css" /> |
| | | <script src="/hxzkoa/hxzk/assets/js/loader.js"></script> |
| | |
| | | <div class='panel-head' id="mapname0">地图0</div> |
| | | <div style="width:100%; height:400px; float:left" id="wrap0"> |
| | | <canvas id="draw0"></canvas> |
| | | <p style="z-index: 9999;" id="jiazai0">正在加载地图......</p> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class='panel-head' id="mapname1">地图1</div> |
| | | <div style="width:100%; height:400px;float:left" id="wrap1"> |
| | | <canvas id="draw1"></canvas> |
| | | <p style="z-index: 9999;" id="jiazai1">正在加载地图......</p> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class='panel-head' id="mapname2">地图2</div> |
| | | <div style="width:100%; height:400px;float:left" id="wrap2"> |
| | | <canvas id="draw2"></canvas> |
| | | <p style="z-index: 9999;" id="jiazai2">正在加载地图......</p> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class='panel-head' id="mapname3">地图4</div> |
| | | <div style="width:100%; height:400px;float:left" id="wrap3"> |
| | | <canvas id="draw3"></canvas> |
| | | <p style="z-index: 9999;" id="jiazai3">正在加载地图......</p> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <!-- END CONTENT PART --> |
| | | |
| | | <!-- END MAIN CONTAINER --> |
| | | |
| | | <% |
| | | String username=(String)session.getAttribute("username"); |
| | | if(username==null || username.equals("")){ |
| | | request.getRequestDispatcher("/hxzk/login.jsp").forward(request,response); |
| | | return; |
| | | } |
| | | %> |
| | | <!-- BEGIN GLOBAL MANDATORY SCRIPTS --> |
| | | <script src="/hxzkoa/hxzk/assets/js/libs/jquery-3.1.1.min.js"></script> |
| | | <script src="/hxzkoa/hxzk/bootstrap/js/popper.min.js"></script> |
| | |
| | | <script> |
| | | var result; |
| | | $(document).ready(function () { |
| | | App.init(); $.ajax({ async: false, type: "POST", url: "/hxzkoa/getSysSetting_list.do", data: {}, dataType: "json", success: function (data) { title = data[0].title; document.title = title; }, }); |
| | | App.init(); $.ajax({ async: false, type: "POST", url: "/hxzkoa/getSysSetting_list.do", data: {}, dataType: "json", success: function (data) { /* title = data[0].title; document.title = title; */ }, }); |
| | | result = getAllMap(); //result["mapname"]=mapnamelist, ['floor']=floorlist |
| | | diaoyonghuatu(result); |
| | | }); |
| | |
| | | |
| | | |
| | | <script> |
| | | |
| | | //首页地图控制 |
| | | var full_screen = false; |
| | | var timer_list = []; |
| | |
| | | var isDelete = false; |
| | | var shipinka = true; |
| | | var tuodong = false; |
| | | var colorbbb = "rgba(255,0,0,0.3)"; |
| | | var sosType = []; |
| | | var sousuoType = true; |
| | | for (var i = 0; i < 500; i++) { |
| | |
| | | _this.context = _this.canvas.getContext('2d'); |
| | | _this.canvas.height = wrap.offsetHeight; |
| | | _this.canvas.width = wrap.offsetWidth; |
| | | |
| | | |
| | | loadImages(imgList, function (images) { |
| | | for (var key in images) { |
| | | if (key == 'map') { |
| | |
| | | //画地图 |
| | | can.drawImage(_this.img, 0, 0, _this.img.naturalWidth, _this.img.naturalHeight, _this.imgXList['map'], _this.imgYList['map'], _this.img.naturalWidth * _this.imgScaleList['map'] * _this.rateNumList['map'], _this.img.naturalHeight * _this.imgScaleList['map'] * _this.rateNumList['map']); |
| | | |
| | | $("#jiazai0").remove() |
| | | $("#jiazai1").remove() |
| | | $("#jiazai2").remove() |
| | | $("#jiazai3").remove() |
| | | |
| | | //实际与图片的比例尺 |
| | | _this.x_ratio = new Number(_this.imgLoadList['map'].naturalWidth / _this.trueLength); |
| | | _this.y_ratio = new Number(_this.imgLoadList['map'].naturalHeight / _this.trueWidth); |
| | |
| | | _this.fenceMarkCount.push(tmp_count); |
| | | }; |
| | | |
| | | // if (shipinka) { |
| | | //画标签及基站 |
| | | for (var key in images) { |
| | | if (key == "icon" && _this.playMark) { |
| | | for (var i = 0; i < _this.playMark.length; i++) { |
| | | var tagzhuangtai = _this.playMark[i][3]; //在线状态 |
| | | var shipinzhuangtai = _this.playMark[i][9]; |
| | | if (shipinka) { |
| | | if (shipinzhuangtai == "1") { |
| | | $.ajax({ |
| | | async: false, |
| | | url: "/hxzkoa/shipinzhuangtai.do", |
| | | type: 'POST', |
| | | dataType: 'JSON', |
| | | data: { |
| | | tagid: _this.playMark[i][0], |
| | | }, |
| | | success: function (data) { |
| | | serial = data[0].shebeiid; |
| | | code = data[0].tongdaoid; |
| | | } |
| | | }); |
| | | document.getElementById("popup").style.display = "flex"; |
| | | var tanchuang = document.getElementById("tanchuang") |
| | | var rr = document.createElement("iframe") |
| | | rr.src = "http://39.106.210.13:10000/play.html?serial=" + serial + "&code=" + code + "&aspect=fullscreen"; |
| | | rr.width = "640"; |
| | | rr.height = "360"; |
| | | rr.allowFullscreen = "true"; |
| | | var object = tanchuang.appendChild(rr); |
| | | shipinka = false; |
| | | } |
| | | } |
| | | //var playMarkInKaoQin = true; |
| | | if (((_this.offView == '1' && tagzhuangtai == '1') || (_this.offView == '0')) && ((_this.diskaoqin == "1" && _this.playMarkInKaoQin[i]) || (_this.diskaoqin == "0"))) { |
| | | //是否开启离线消失,并判断状态(在线1/离线0);当开启离线消失时(仅显示在线标签),当未开启离线消失时(全部显示) |
| | | //是否开启出考勤区域消失,并判断是否在考勤区域内;当开启出考勤区域消失时(需要在考勤区域内),当未开启时(全部显示) |
| | | |
| | | //画标签及基站 |
| | | for (var key in images) { |
| | | if (key == "icon" && _this.playMark) { |
| | | for (var i = 0; i < _this.playMark.length; i++) { |
| | | //_this.trackNow = []; |
| | | var tagzhuangtai = _this.playMark[i][3]; //在线状态 |
| | | var shipinzhuangtai = _this.playMark[i][9]; |
| | | if (shipinka) { |
| | | if (shipinzhuangtai == "1") { |
| | | $.ajax({ |
| | | async: false, |
| | | url: "/hxzkoa/shipinzhuangtai.do", |
| | | type: 'POST', |
| | | dataType: 'JSON', |
| | | data: { |
| | | tagid: _this.playMark[i][0], |
| | | }, |
| | | success: function(data){ |
| | | // console.log(data[0].shebeiid) |
| | | serial = data[0].shebeiid; |
| | | // console.log(data[0].tongdaoid) |
| | | code = data[0].tongdaoid; |
| | | //读取当前实际坐标 |
| | | var cor_x = new Number(_this.playMark[i][4]); // 此处_this.playMark是数据库里取到的当前点坐标,4是posx,5是posy |
| | | var cor_y = new Number(_this.playMark[i][5]); |
| | | |
| | | //转为图上坐标 |
| | | var x_cor_now = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor_now = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | |
| | | //是否有轨迹拖尾 |
| | | if (_this.real_trak_time != 0) { |
| | | var trackNow; |
| | | var pm = _this.playMark; |
| | | |
| | | function ftn(current_floor, pm, tn, rtk, ctt, rtc, igxm, igym, igslm, rnlm, xr, yr, xx0, yy0) { |
| | | //trackNow = getTracknow(current_floor, pm[0], rtk) |
| | | if (tn.length == 0) { |
| | | trackNow = []; |
| | | } else if (pm[0] in tn) { |
| | | trackNow = tn[pm[0]]; |
| | | } else { |
| | | trackNow = []; |
| | | }; |
| | | var can = ctt; |
| | | can.beginPath(); |
| | | can.strokeStyle = rtc; |
| | | can.fillStyle = rtc; |
| | | for (var i = 0; i < trackNow.length; i++) { |
| | | var cor_x = new Number(trackNow[i][0]); |
| | | var cor_y = new Number(trackNow[i][1]); |
| | | var x_cor = new Number(igxm + igslm * rnlm * xr * (cor_x - xx0)); |
| | | var y_cor = new Number(igym + igslm * rnlm * yr * (cor_y - yy0)); |
| | | |
| | | // var cor_x2 = new Number(trackNow[i+1][0]); |
| | | // var cor_y2 = new Number(trackNow[i+1][1]); |
| | | // var x_cor2 = new Number(igxm + igslm * rnlm * xr * (cor_x2 - xx0)); |
| | | // var y_cor2 = new Number(igym + igslm * rnlm * yr * (cor_y2 - yy0)); |
| | | |
| | | // can.moveTo(x_cor, y_cor); |
| | | // can.lineTo(x_cor2, y_cor2); |
| | | // can.stroke(); |
| | | // can.fill(); |
| | | can.moveTo(x_cor, y_cor); |
| | | can.arc(x_cor, y_cor, 1, 0, Math.PI * 2, true); |
| | | can.fill(); |
| | | }; |
| | | can.closePath(); |
| | | can.stroke(); |
| | | trackNow = null; |
| | | } |
| | | }); |
| | | document.getElementById("popup").style.display = "flex"; |
| | | // serial = "34020000001320000003"; |
| | | // code = "34020000001310000002"; |
| | | var tanchuang = document.getElementById("tanchuang") |
| | | var rr = document.createElement("iframe") |
| | | rr.src = "http://192.168.1.100:10000/play.html?serial=" + serial + "&code=" + code + "&aspect=fullscreen"; |
| | | rr.width = "640"; |
| | | rr.height = "360"; |
| | | rr.allowFullscreen = "true"; |
| | | var object = tanchuang.appendChild(rr); |
| | | shipinka = false; |
| | | } |
| | | } |
| | | //var playMarkInKaoQin = true; |
| | | if (((_this.offView == '1' && tagzhuangtai == '1') || (_this.offView == '0')) && ((_this.diskaoqin == "1" && _this.playMarkInKaoQin[i]) || (_this.diskaoqin == "0"))) { |
| | | //是否开启离线消失,并判断状态(在线1/离线0);当开启离线消失时(仅显示在线标签),当未开启离线消失时(全部显示) |
| | | //是否开启出考勤区域消失,并判断是否在考勤区域内;当开启出考勤区域消失时(需要在考勤区域内),当未开启时(全部显示) |
| | | |
| | | //读取当前实际坐标 |
| | | var cor_x = new Number(_this.playMark[i][4]); // 此处_this.playMark是数据库里取到的当前点坐标,4是posx,5是posy |
| | | var cor_y = new Number(_this.playMark[i][5]); |
| | | |
| | | //转为图上坐标 |
| | | var x_cor_now = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor_now = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | |
| | | //是否有轨迹拖尾 |
| | | if (_this.real_trak_time != 0) { |
| | | var trackNow; |
| | | var pm = _this.playMark; |
| | | |
| | | function ftn(current_floor, pm, tn, rtk, ctt, rtc, igxm, igym, igslm, rnlm, xr, yr, xx0, yy0) { |
| | | //trackNow = getTracknow(current_floor, pm[0], rtk) |
| | | if (tn.length == 0) { |
| | | trackNow = []; |
| | | } else if (pm[0] in tn) { |
| | | trackNow = tn[pm[0]]; |
| | | } else { |
| | | trackNow = []; |
| | | }; |
| | | var can = ctt; |
| | | can.beginPath(); |
| | | can.strokeStyle = rtc; |
| | | can.fillStyle = rtc; |
| | | for (var i = 0; i < trackNow.length; i++) { |
| | | var cor_x = new Number(trackNow[i][0]); |
| | | var cor_y = new Number(trackNow[i][1]); |
| | | var x_cor = new Number(igxm + igslm * rnlm * xr * (cor_x - xx0)); |
| | | var y_cor = new Number(igym + igslm * rnlm * yr * (cor_y - yy0)); |
| | | |
| | | // var cor_x2 = new Number(trackNow[i+1][0]); |
| | | // var cor_y2 = new Number(trackNow[i+1][1]); |
| | | // var x_cor2 = new Number(igxm + igslm * rnlm * xr * (cor_x2 - xx0)); |
| | | // var y_cor2 = new Number(igym + igslm * rnlm * yr * (cor_y2 - yy0)); |
| | | |
| | | // can.moveTo(x_cor, y_cor); |
| | | // can.lineTo(x_cor2, y_cor2); |
| | | // can.stroke(); |
| | | // can.fill(); |
| | | can.moveTo(x_cor, y_cor); |
| | | can.arc(x_cor, y_cor, 1, 0, Math.PI * 2, true); |
| | | can.fill(); |
| | | }; |
| | | can.closePath(); |
| | | can.stroke(); |
| | | //_this.trackNow.push([trackNow]); |
| | | } |
| | | setTimeout(ftn(current_floor, _this.playMark[i], _this.trackNow, _this.real_trak_time, _this.context, _this.real_trak_color, _this.imgXList['map'], _this.imgYList['map'], _this.imgScaleList['map'], _this.rateNumList['map'], _this.x_ratio, _this.y_ratio, _this.x_x0, _this.y_y0), 5); |
| | | //var trackNow = getTracknow( _this.playMark[i][0], _this.real_trak_time);//获取指定时间段内该tagid的数据进行绘制 |
| | | } else { |
| | | _this.trackNow = []; |
| | | } |
| | | var isSos = _this.playMark[i][7]; |
| | | if (_this.playMark[i][8] == "1") { |
| | | if (sousuoType) { |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | setTimeout(ftn(current_floor, _this.playMark[i], _this.trackNow, _this.real_trak_time, _this.context, _this.real_trak_color, _this.imgXList['map'], _this.imgYList['map'], _this.imgScaleList['map'], _this.rateNumList['map'], _this.x_ratio, _this.y_ratio, _this.x_x0, _this.y_y0), 5); |
| | | //var trackNow = getTracknow( _this.playMark[i][0], _this.real_trak_time);//获取指定时间段内该tagid的数据进行绘制 |
| | | } else { |
| | | can.drawImage(sousuo0, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | _this.trackNow = []; |
| | | } |
| | | sousuoType = !sousuoType; |
| | | } else { |
| | | if (isSos) { |
| | | if (sosType[i]) { |
| | | can.drawImage(sos, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2 + 3, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]) + 2, images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | var isSos = _this.playMark[i][7]; |
| | | if (_this.playMark[i][8] == "1") { |
| | | if (sousuoType) { |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | } else { |
| | | can.drawImage(sos1, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2 + 3, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]) + 2, images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | can.drawImage(sousuo0, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | } |
| | | sosType[i] = !sosType[i]; |
| | | sousuoType = !sousuoType; |
| | | } else { |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | if (isSos) { |
| | | if (sosType[i]) { |
| | | can.drawImage(sos, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2 + 3, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]) + 2, images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | } else { |
| | | can.drawImage(sos1, 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2 + 3, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]) + 2, images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | } |
| | | sosType[i] = !sosType[i]; |
| | | } else { |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | } |
| | | } |
| | | } |
| | | |
| | | //画在相应位置上 |
| | | // can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | //画在相应位置上 |
| | | // can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor_now - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor_now - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key], images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]); |
| | | |
| | | if (_this.tagZb == '1') { //是否显示标签坐标 |
| | | can.fillStyle = 'red'; |
| | | //var f = 8*( _this.imgScaleList['map']); |
| | | //can.font=f+"px Arial"; |
| | | if (_this.tagZb == '1') { //是否显示标签坐标 |
| | | can.fillStyle = 'red'; |
| | | //var f = 8*( _this.imgScaleList['map']); |
| | | can.font = "11px Arial"; |
| | | |
| | | tagzuobiao = _this.playMark[i][4] + ',' + _this.playMark[i][5]; |
| | | can.fillText(tagzuobiao, x_cor_now - 20, y_cor_now + 10); |
| | | tagzuobiao = _this.playMark[i][4] + ',' + _this.playMark[i][5]; |
| | | can.fillText(tagzuobiao, x_cor_now - 20, y_cor_now + 10); |
| | | }; |
| | | if (_this.viewName == '1') { //是否显示人员名称 |
| | | can.fillStyle = 'white'; |
| | | can.font = '13px sans-serif'; |
| | | if (_this.viewTagid == '1') { //是否显示标签id |
| | | if (_this.playMark[i][2] <= 10) { |
| | | fillRoundRect(can, x_cor_now - 40, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 2, 20, 4, '#FF0000'); |
| | | } else { |
| | | fillRoundRect(can, x_cor_now - 40, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 2, 20, 4, '#32CD32'); |
| | | } |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][1], x_cor_now - 38, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | can.fillText(_this.playMark[i][0], x_cor_now + 5, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } else { |
| | | if (_this.playMark[i][2] <= 10) { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#FF0000'); |
| | | } else { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#32CD32'); |
| | | } |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][1], x_cor_now - 19, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } |
| | | } else { |
| | | can.font = '13px sans-serif'; |
| | | can.fillStyle = 'white'; |
| | | if (_this.viewTagid == '1') { |
| | | if (_this.playMark[i][2] <= 10) { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#FF0000'); |
| | | } else { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#32CD32'); |
| | | } |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][0], x_cor_now - 14, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } |
| | | } |
| | | |
| | | if (_this.viewPower == '1') { //是否显示电量 |
| | | can.font = '10px sans-serif'; |
| | | can.fillStyle = 'red'; |
| | | can.fillText("电量:" + _this.playMark[i][2], x_cor_now - 20, y_cor_now + 20); |
| | | }; |
| | | }; |
| | | if (_this.viewName == '1') { //是否显示人员名称 |
| | | can.fillStyle = 'white'; |
| | | can.font = '13px sans-serif'; |
| | | if (_this.viewTagid == '1') { //是否显示标签id |
| | | fillRoundRect(can, x_cor_now - 40, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 2, 20, 4, '#32CD32'); |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][1], x_cor_now - 38, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | can.fillText(_this.playMark[i][0], x_cor_now + 5, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } else { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#32CD32'); |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][1], x_cor_now - 19, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } |
| | | } else { |
| | | can.font = '13px sans-serif'; |
| | | can.fillStyle = 'white'; |
| | | if (_this.viewTagid == '1') { |
| | | fillRoundRect(can, x_cor_now - 20, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 18, images[key].naturalHeight * 1.1, 20, 4, '#32CD32'); |
| | | can.fillStyle = 'white'; |
| | | can.fillText(_this.playMark[i][0], x_cor_now - 14, y_cor_now - images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] - 3); |
| | | } |
| | | } |
| | | |
| | | if (_this.viewPower == '1') { //是否显示电量 |
| | | can.font = '10px sans-serif'; |
| | | can.fillStyle = 'red'; |
| | | can.fillText("电量:" + _this.playMark[i][2], x_cor_now - 20, y_cor_now + 20); |
| | | } |
| | | } else if (key == 'anchor_online') { |
| | | can.font = '10px sans-serif'; |
| | | if (_this.anckicon == '1') { //是否显示基站图标 |
| | | //_this.anchorList = [anchorid, posx,posy,posz,layer,greatetime] |
| | | for (var i = 0; i < _this.onlineAnchorList.length; i++) { |
| | | var cor_x = new Number(_this.onlineAnchorList[i][1]); |
| | | var cor_y = new Number(_this.onlineAnchorList[i][2]); |
| | | var x_cor = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth, images[key].naturalHeight); |
| | | if (_this.viewAnckzb == '1') { //是否显示基站坐标 |
| | | can.fillStyle = 'red' |
| | | var anchorzuobiao = _this.onlineAnchorList[i][1] + ',' + _this.onlineAnchorList[i][2] + ',' + _this.onlineAnchorList[i][3]; |
| | | can.fillText(anchorzuobiao, x_cor - 15, y_cor + 30); |
| | | }; |
| | | if (_this.viewAnckid == '1') { //是否显示基站id |
| | | can.fillStyle = 'red'; |
| | | var tigidd = _this.onlineAnchorList[i][0]; |
| | | can.fillText(tigidd, x_cor - 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] + 10) / 2); |
| | | }; |
| | | }; |
| | | }; |
| | | } else if (key == 'anchor_offline') { |
| | | can.font = '10px sans-serif'; |
| | | if (_this.anckicon == '1') { //是否显示基站图标 |
| | | //_this.anchorList = [anchorid, posx,posy,posz,layer,greatetime] |
| | | for (var i = 0; i < _this.offlineAnchorList.length; i++) { |
| | | var cor_x = new Number(_this.offlineAnchorList[i][1]); |
| | | var cor_y = new Number(_this.offlineAnchorList[i][2]); |
| | | var x_cor = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth, images[key].naturalHeight); |
| | | if (_this.viewAnckzb == '1') { //是否显示基站坐标 |
| | | can.fillStyle = 'red' |
| | | var anchorzuobiao = _this.offlineAnchorList[i][1] + ',' + _this.offlineAnchorList[i][2] + ',' + _this.offlineAnchorList[i][3]; |
| | | can.fillText(anchorzuobiao, x_cor - 15, y_cor + 30); |
| | | }; |
| | | if (_this.viewAnckid == '1') { //是否显示基站id |
| | | can.fillStyle = 'red'; |
| | | can.fillText(_this.offlineAnchorList[i][0], x_cor - 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] + 10) / 2); |
| | | }; |
| | | }; |
| | | }; |
| | | } |
| | | } else if (key == 'anchor_online') { |
| | | can.font = '10px sans-serif'; |
| | | if (_this.anckicon == '1') { //是否显示基站图标 |
| | | //_this.anchorList = [anchorid, posx,posy,posz,layer,greatetime] |
| | | for (var i = 0; i < _this.onlineAnchorList.length; i++) { |
| | | var cor_x = new Number(_this.onlineAnchorList[i][1]); |
| | | var cor_y = new Number(_this.onlineAnchorList[i][2]); |
| | | var x_cor = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth, images[key].naturalHeight); |
| | | if (_this.viewAnckzb == '1') { //是否显示基站坐标 |
| | | can.fillStyle = 'red' |
| | | var anchorzuobiao = _this.onlineAnchorList[i][1] + ',' + _this.onlineAnchorList[i][2] + ',' + _this.onlineAnchorList[i][3]; |
| | | can.fillText(anchorzuobiao, x_cor - 15, y_cor + 30); |
| | | }; |
| | | if (_this.viewAnckid == '1') { //是否显示基站id |
| | | can.fillStyle = 'red'; |
| | | var tigidd = _this.onlineAnchorList[i][0]; |
| | | can.fillText(tigidd, x_cor - 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] + 10) / 2); |
| | | }; |
| | | }; |
| | | }; |
| | | } else if (key == 'anchor_offline') { |
| | | can.font = '10px sans-serif'; |
| | | if (_this.anckicon == '1') { //是否显示基站图标 |
| | | //_this.anchorList = [anchorid, posx,posy,posz,layer,greatetime] |
| | | for (var i = 0; i < _this.offlineAnchorList.length; i++) { |
| | | var cor_x = new Number(_this.offlineAnchorList[i][1]); |
| | | var cor_y = new Number(_this.offlineAnchorList[i][2]); |
| | | var x_cor = new Number(_this.imgXList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.x_ratio * (cor_x - _this.x_x0)); |
| | | var y_cor = new Number(_this.imgYList['map'] + _this.imgScaleList['map'] * _this.rateNumList['map'] * _this.y_ratio * (cor_y - _this.y_y0)); |
| | | can.drawImage(images[key], 0, 0, images[key].naturalWidth, images[key].naturalHeight, x_cor - (images[key].naturalWidth * _this.imgScaleList[key] * _this.rateNumList[key]) / 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key]), images[key].naturalWidth, images[key].naturalHeight); |
| | | if (_this.viewAnckzb == '1') { //是否显示基站坐标 |
| | | can.fillStyle = 'red' |
| | | var anchorzuobiao = _this.offlineAnchorList[i][1] + ',' + _this.offlineAnchorList[i][2] + ',' + _this.offlineAnchorList[i][3]; |
| | | can.fillText(anchorzuobiao, x_cor - 15, y_cor + 30); |
| | | }; |
| | | if (_this.viewAnckid == '1') { //是否显示基站id |
| | | can.fillStyle = 'red'; |
| | | can.fillText(_this.offlineAnchorList[i][0], x_cor - 2, y_cor - (images[key].naturalHeight * _this.imgScaleList[key] * _this.rateNumList[key] + 10) / 2); |
| | | }; |
| | | }; |
| | | }; |
| | | } |
| | | }; |
| | | }; |
| | | // } |
| | | |
| | | //开启隧道定位后,需要显示当前考勤区域内的总标签数量 |
| | | //_this.fenceMarkCount(count) |
| | | //_this.realFenceList([name, type, zuobiao_array]) |
| | | //_this.FenceColor(color) |
| | | if (_this.tunlDw == "1") { |
| | | var k = 0; |
| | | fillRoundRect(can, 10, 10, 140, 40 * _this.fenceMarkCount.length, 10, colorbbb); |
| | | for (var i = 0; i < _this.fenceMarkCount.length; i++) { |
| | | // if (_this.realFenceList[i][1] == "考勤区域"){ |
| | | can.beginPath(); |
| | | can.fillStyle = getDrawColor(_this.FenceColor[i]); |
| | | can.fillRect(10, 10 + 50 * k, 140, 30); |
| | | can.fillStyle = "red"; |
| | | can.fillText(_this.realFenceList[i][0] + ":" + _this.fenceMarkCount[i], 65, 25 + 50 * k); |
| | | can.fillStyle = "rgba(255,255,0,0.7)"; |
| | | can.font = "15px Verdana"; |
| | | can.fillText(_this.realFenceList[i][0] + ":" + _this.fenceMarkCount[i], 34, 36 + 40 * k); |
| | | can.closePath(); |
| | | k += 1; |
| | | // }; |
| | | }; |
| | | }; |
| | | |
| | |
| | | if (tuodong == true) { |
| | | return false; |
| | | } |
| | | if (shipinka == false) { |
| | | return false; |
| | | } |
| | | //当前实时坐标 |
| | | _this.playMark = getRealPosition(current_floor); |
| | | // var tagid_str = ""; |
| | |
| | | // clearInterval(timer_screen); |
| | | // timer = setInterval(fn, t); |
| | | // } |
| | | _this.timer = setInterval(fn, t); |
| | | // var mapa0 = document.getElementById("wrap0") |
| | | // mapa0.value = "正在加载地图......" |
| | | // var mapa0 = document.getElementById("wrap0") |
| | | // var tt = document.createElement("p"); |
| | | // tt.value="正在加载地图......" |
| | | // tt.style="" |
| | | // mapa0.appendChild(tt) |
| | | setTimeout(fnnn, 3000) |
| | | function fnnn(){ |
| | | _this.timer = setInterval(fn, t); |
| | | } |
| | | // _this.timer = setInterval(fn, t); |
| | | timer_list.push(_this.timer); |
| | | }, |
| | | /*计算当前鼠标位置距离canvas的偏移量*/ |
| | |
| | | for (var i = 0; i < 4; i++) { |
| | | if (String(i) != id) { |
| | | var str = "map" + i; |
| | | // document.getElementById(str).style.position = "fixed"; |
| | | // document.getElementById(str).style.left = "100%"; |
| | | document.getElementById(str).style.display = "none"; |
| | | } |
| | | }; |
| | |
| | | clearInterval(timer_list[i]); |
| | | } |
| | | timer_list = []; |
| | | console.log(result) |
| | | diaoyonghuatu(result); |
| | | } else if ((event.type == "dblclick") && (full_screen == true)) { |
| | | _this.expand = false; |