From f5946c627051c9515086cbfb3a03832cd8721ab7 Mon Sep 17 00:00:00 2001 From: ZhuDongming <773644075@qq.com> Date: Tue, 13 Aug 2019 13:07:59 +0800 Subject: [PATCH] 调整路线箭头大小 --- src/main/webapp/view/uavTrajectory.jsp | 132 +++++++++++++++++++++++++++++++++++++------ 1 files changed, 113 insertions(+), 19 deletions(-) diff --git a/src/main/webapp/view/uavTrajectory.jsp b/src/main/webapp/view/uavTrajectory.jsp index c0ed2d9..74785b8 100644 --- a/src/main/webapp/view/uavTrajectory.jsp +++ b/src/main/webapp/view/uavTrajectory.jsp @@ -34,10 +34,81 @@ padding: 0; list-style: none; } + + #cpm { + width: 300px; + height: 100px; + position: absolute; + background-color: #ffffff; + display: none; + left: 50%; + top: 50%; + margin-left: -150px; + margin-top: -50px; + z-index: 11; + color: #000000; + border: 2px solid #FF7F50; + font-size: 28px; + line-height: 100px; + text-align: center; + } + + .BMap_top { + display: none; + } + + .BMap_center { + display: none; + } + + .BMap_bubble_title { + color: white; + font-size: 13px; + font-weight: bold; + text-align: left; + padding-left: 5px; + padding-top: 5px; + background-color: #2DA0EB; + } + + .BMap_bubble_content { + background-color: white; + padding-left: 5px; + padding-top: 5px; + padding-bottom: 10px; + } + + .BMap_pop img { + top: 45px !important; + left: 220px !important; + } + + .BMap_pop div:nth-child(1) div { + display: none; + } + + .BMap_pop div:nth-child(3) { + display: none; + } + + .BMap_pop div:nth-child(5) { + display: none; + } + + .BMap_pop div:nth-child(7) { + display: none; + } + + .BMap_pop div:nth-child(9) { + top: 35px !important; + border-radius: 5px; + } + </style> <body> <div class="main_body"> + <div id="cpm">������������������</div> <div id="mapCanvas"></div> <!-- ������������ --> <!-- ���sensorInfo,regionCode,regionName,monitorPoint,device--> <div id="uavTrajectoryParams" style="display: none;"> @@ -71,21 +142,18 @@ }); map.addControl(navigation); map.addControl(new BMap.ScaleControl()); - var longitude; - var latitude; - var point; if (sensorInfo.length == 0) { - longitude = 120.987287; - latitude = 31.391562; - point = new BMap.Point(longitude, latitude); - map.centerAndZoom(point, 17); - alert("���������������������"); + showNoFlightTrajectory(); } var trackPoints = []; //��������������������������������������������������������������� var coincidentPoints = new Array(); if (sensorInfo.length > 0) { $.each(sensorInfo, function (item, value) { - trackPoints.push(new BMap.Point(value.������, value.������)); + if (typeof (value.������) == "undefined") { + showNoFlightTrajectory(); + } else { + trackPoints.push(new BMap.Point(value.������.substr(0, value.������.length - 1), value.������.substr(0, value.������.length - 1))); + } }) for (var i = 0; i < trackPoints.length; i++) { var startPoint = trackPoints[i]; @@ -95,9 +163,11 @@ var arrowLength;//��������������������� if (distance <= 5) { arrowLength = 0; - } else if (distance > 5 && distance <= 10) { + } else if (distance > 5 && distance <= 20) { arrowLength = 2; - } else if (distance <= 100) { + } else if (distance > 20 && distance <= 50) { + arrowLength = 3; + } else if (distance > 50 && distance <= 100) { arrowLength = 5; } else if (distance > 100 && distance <= 200) { arrowLength = 10; @@ -132,7 +202,7 @@ startPoint, endPoint ], - {strokeColor: "green", strokeWeight: 2, strokeOpacity: 1} + {strokeColor: "#5298FF", strokeWeight: 4, strokeOpacity: 1} ); if (i < trackPoints.length - 1 && trackPoints.length > 1) { map.addOverlay(polyline);// ��������������� @@ -162,12 +232,19 @@ } var count = 0; var winfowText = - '<div style="min-height:20px;overflow-y:auto;max-height:400px;" >'; + '<div style="min-height:20px;overflow:auto;max-height:400px;" >'; + var opts = { + width: 220, + title: '<h4>���������������</h4>', // ������������������ + enableMessage: false, //��������������������������������� + } + for (var j = i + 1; j < trackPoints.length; j++) { distance = map.getDistance(trackPoints[i], trackPoints[j]).toFixed(5); if (distance <= 1.9) { if (coincidentPoints.indexOf(i) == -1) { coincidentPoints.push(i); + winfowText +='<p id="' + i + '" onclick="openInfo(this)" onmousemove="red(this.id)" onmouseout="black(this.id)">' + "���������" + sensorInfo[i].������ + "</p>"; } coincidentPoints.push(j); count++; @@ -178,7 +255,7 @@ } if (coincidentPoints.indexOf(i) > -1) { - winfowText = '<p id="' + i + '" onclick="openInfo(this)" onmousemove="red(this.id)" onmouseout="black(this.id)">' + "���������" + sensorInfo[i].������ + "</p>" + winfowText + "</div>"; + winfowText = winfowText + "</div>"; } else { for (var prop in sensorInfo[i]) { if (sensorInfo[i].hasOwnProperty(prop)) { @@ -187,22 +264,25 @@ } winfowText += "</div>"; } + (function (x) { - var infoWindow = new BMap.InfoWindow(winfowText, {enableMessage: false}); + var infoWindow = new BMap.InfoWindow(winfowText, opts); marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); }); })(i); function openInfo(e) { - var point = new BMap.Point(sensorInfo[e.id].������, sensorInfo[e.id].������); - var winfowText1 = ""; + var point = new BMap.Point(sensorInfo[e.id].������.substr(0, sensorInfo[e.id].������.length - 1), sensorInfo[e.id].������.substr(0, sensorInfo[e.id].������.length - 1)); + var winfowText1 = + '<div style="min-height:20px;overflow:auto;max-height:400px;" >'; for (var prop in sensorInfo[e.id]) { if (sensorInfo[e.id].hasOwnProperty(prop)) { winfowText1 += (prop + "���" + sensorInfo[e.id][prop] + "</br>"); } } - var infoWindow1 = new BMap.InfoWindow(winfowText1, {enableMessage: false}); + winfowText1 += "</div>"; + var infoWindow1 = new BMap.InfoWindow(winfowText1, opts); //������������������ map.openInfoWindow(infoWindow1, point); } @@ -214,6 +294,10 @@ function black(x) { document.getElementById(x).style.color = "#000000"; + } + + function openInfoWindow() { + map.openInfoWindow.apply(map, arguments); //������������������ } if (count > 0) { @@ -285,9 +369,19 @@ var pointArrow1 = map.pixelToPoint(new BMap.Pixel(pixelX1, pixelY1)); var pointMiddle = map.pixelToPoint(new BMap.Pixel(poMiddleX, poMiddleY)); var Arrow = new BMap.Polyline([pointArrow, pointMiddle, pointArrow1], - {strokeColor: "green", strokeWeight: 2, strokeOpacity: 1}); + {strokeColor: "#5298FF", strokeWeight: 4, strokeOpacity: 1}); map.addOverlay(Arrow); } }; + function showNoFlightTrajectory() { + var longitude = 120.987287; + var latitude = 31.391562; + var point = new BMap.Point(longitude, latitude); + map.centerAndZoom(point, 17); + setTimeout(function () { + document.getElementById("cpm").style.display = 'block'; + }, 250); + }; + </script> -- Gitblit v1.8.0