工业级后台API v2
blame | history | patch | commit | commitdiff | ignore whitespace
ZhuDongming
2019-08-15 50e24cdfd75ada4dd6ea5dce74803b7f96e3ba81 
 src/main/webapp/view/uavTrajectory.jsp


@@ -34,10 +34,78 @@


        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: 5px 5px 0 5px;


        background-color: #2DA0EB;


    }




    .BMap_bubble_content {


        background-color: white;


        padding: 5px 5px 10px 5px;


    }




    .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,23 +139,24 @@


    });


    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();


    var flyingParameters=['经度','纬度','高度','速度x','速度y','速度z'];


    var monitorParameters=['PM2.5','PM10','一氧化碳','二氧化硫','二氧化氮','臭氧','VOCs总量','气压','温度','湿度','核辐射'];


    if (sensorInfo.length > 0) {


        $.each(sensorInfo, function (item, value) {


            trackPoints.push(new BMap.Point(value.经度.substr(0,value.经度.length-1), value.纬度.substr(0,value.纬度.length-1)));


            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 flyingData=[];


            var monitorData=[];


            var startPoint = trackPoints[i];


            var endPoint = trackPoints[i + 1];


            var marker;


@@ -95,9 +164,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 +203,7 @@


                    startPoint,


                    endPoint


                ],


                {strokeColor: "#5298FF", strokeWeight: 5, strokeOpacity: 1}


                {strokeColor: "#5298FF", strokeWeight: 4, strokeOpacity: 1}


            );


            if (i < trackPoints.length - 1 && trackPoints.length > 1) {


                map.addOverlay(polyline);// 画两点间线


@@ -162,12 +233,25 @@


            }


            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>时间：'+sensorInfo[i].时间+'</h4>', // 信息窗口标题


                enableMessage: false, //设置允许信息窗发送短息


            }




            var optsCoincide = {


                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++;


@@ -176,33 +260,64 @@


                    winfowText += winfowTextAdd;


                }


            }




            var monitorDataResult=monitorDataSort(sensorInfo[i],monitorData,monitorParameters);


            var flyingDataResult=flyingDataSort(sensorInfo[i],flyingData,flyingParameters);


            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)) {


                        winfowText += (prop + "：" + sensorInfo[i][prop] + "</br>");


                winfowText +='<h4 style="background-color: #CD5C5C;color:white">监测因子信息</h4>';


                for (var prop in monitorDataResult) {


                    if (monitorDataResult.hasOwnProperty(prop)) {


                        winfowText += (prop + "：" + monitorDataResult[prop] + "</br>");


                    }


                }


                winfowText +='<h4 style="background-color: #66CD00;color:white">飞行因子信息</h4>';


                for (var prop in flyingDataResult) {


                    if (flyingDataResult.hasOwnProperty(prop)) {


                        winfowText += (prop + "：" + flyingDataResult[prop] + "</br>");


                    }


                }


                winfowText += "</div>";


            }




            (function (x) {


                var infoWindow = new BMap.InfoWindow(winfowText, {enableMessage: false});


                if (coincidentPoints.indexOf(i) > -1) {


                    var infoWindow = new BMap.InfoWindow(winfowText, optsCoincide);


                }else{


                    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].经度.substr(0,sensorInfo[e.id].经度.length-1), sensorInfo[e.id].纬度.substr(0,sensorInfo[e.id].纬度.length-1));


                var winfowText1 = "";


                for (var prop in sensorInfo[e.id]) {


                    if (sensorInfo[e.id].hasOwnProperty(prop)) {


                        winfowText1 += (prop + "：" + sensorInfo[e.id][prop] + "</br>");


                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 flyingData=[];


                var monitorData=[];


                var monitorDataCoincide=monitorDataSort(sensorInfo[e.id],monitorData,monitorParameters);


                var flyingDataCoincide=flyingDataSort(sensorInfo[e.id],flyingData,flyingParameters);


                var winfowText1 =


                    '<div style="min-height:20px;overflow:auto;max-height:400px;" >';


                winfowText1 +='<h4 style="background-color: #CD5C5C;color:white">监测因子信息</h4>';


                for (var prop in monitorDataCoincide) {


                    if (monitorDataCoincide.hasOwnProperty(prop)) {


                        winfowText1 += (prop + "：" + monitorDataCoincide[prop] + "</br>");


                    }


                }


                var infoWindow1 = new BMap.InfoWindow(winfowText1, {enableMessage: false});


                winfowText1 +='<h4 style="background-color: #66CD00;color:white">飞行因子信息</h4>';


                for (var prop in flyingDataCoincide) {


                    if (flyingDataCoincide.hasOwnProperty(prop)) {


                        winfowText1 += (prop + "：" + flyingDataCoincide[prop] + "</br>");


                    }


                }


                winfowText1 += "</div>";


                var optsCoincideChild = {


                    width: 220,


                    title: '<h4>时间：'+sensorInfo[e.id].时间+'</h4>', // 信息窗口标题


                    enableMessage: false, //设置允许信息窗发送短息


                }


                var infoWindow1 = new BMap.InfoWindow(winfowText1, optsCoincideChild);


                //开启信息窗口


                map.openInfoWindow(infoWindow1, point);


            }


@@ -216,6 +331,32 @@


                document.getElementById(x).style.color = "#000000";


            }




            function openInfoWindow() {


                map.openInfoWindow.apply(map, arguments); //开启信息窗口


            }


            


            function monitorDataSort(sensorMap,monitorData,monitorParameters) {


                for(var j = 0; j < monitorParameters.length; j++) {


                    $.map(sensorMap,function(value,key){


                        if (monitorParameters[j]==key) {


                            monitorData[key]=sensorMap[key];


                        }


                    });


                }


                return monitorData;


            }




            function flyingDataSort(sensorMap,flyingData,flyingParameters) {


                for(var k = 0; k < flyingParameters.length; k++) {


                    $.map(sensorMap,function(value,key){


                        if (flyingParameters[k]==key) {


                            flyingData[key]=sensorMap[key];


                        }


                    });


                }


                return flyingData;


            }




            if (count > 0) {


                var lab;


                if (count > 0 && count <= 8) {


@@ -227,6 +368,17 @@


                } else {


                    lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-18, -9)});


                }


                lab.setStyle({


                    color: "#fff",


                    fontSize: "16px",


                    backgroundColor: "1",


                    border: "0",


                    fontWeight: "bold"


                });


                map.addOverlay(lab);


            }


            if(count==0){


                var lab=new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-7,-22)});


                lab.setStyle({


                    color: "#fff",


                    fontSize: "16px",


@@ -285,9 +437,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: "#5298FF", strokeWeight: 5, 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>