From d44db08aa75fe0f243c1a9a09f35a6d8432b90fb Mon Sep 17 00:00:00 2001 From: JinPengYong <812110275@qq.com> Date: Tue, 30 Jun 2020 23:23:46 +0800 Subject: [PATCH] 无人机应用大屏页面update --- src/main/webapp/view/uavtracing.jsp | 328 ++++++++++++----- src/main/webapp/view/uavdroppointnew.jsp | 450 +++++++++++++++++++++++ src/main/webapp/view/uavchannel.jsp | 161 +++++++ src/main/webapp/view/uavdroppoint.jsp | 166 ++++++++ src/main/java/com/moral/controller/ScreenController.java | 2 5 files changed, 981 insertions(+), 126 deletions(-) diff --git a/src/main/java/com/moral/controller/ScreenController.java b/src/main/java/com/moral/controller/ScreenController.java index bf309bd..cba5ca9 100644 --- a/src/main/java/com/moral/controller/ScreenController.java +++ b/src/main/java/com/moral/controller/ScreenController.java @@ -1687,7 +1687,7 @@ params.put("description",parameters.get("description")); String paramsJson = params.toJSONString(); model.addObject("uavDroppointParams", paramsJson); - model.setViewName("uavdroppoint"); + model.setViewName("uavdroppointnew"); return model; } else { StringBuilder msg = new StringBuilder(); diff --git a/src/main/webapp/view/uavchannel.jsp b/src/main/webapp/view/uavchannel.jsp index 91a3e03..a5efd55 100644 --- a/src/main/webapp/view/uavchannel.jsp +++ b/src/main/webapp/view/uavchannel.jsp @@ -64,10 +64,6 @@ border: 2px solid red; } - .trr { - border-collapse: collapse; - } - .trr th, td { border: 1px solid black; text-align: center; @@ -83,11 +79,9 @@ <script type="text/javascript" src="../js/jquery.min.js"></script> </head> <body> - <div id="data"> <%--������������������--%> - <table id="tab" style="border:1px solid black;width: 280px"> - </table> + <table id="tab" style="border:1px solid black;width: 280px"></table> </div> <div class="main_body"> <div id="cpm">������������</div> @@ -100,6 +94,135 @@ </body> </html> <script type="text/javascript"> + /* + ��������������� + * */ + var GPS = { + PI: 3.14159265358979324, + x_pi: 3.14159265358979324 * 3000.0 / 180.0, + delta: function (lat, lon) { + var a = 6378245.0; // a: ������������������������������������������������������������������ + var ee = 0.00669342162296594323; // ee: ��������������������� + var dLat = this.transformLat(lon - 105.0, lat - 35.0); + var dLon = this.transformLon(lon - 105.0, lat - 35.0); + var radLat = lat / 180.0 * this.PI; + var magic = Math.sin(radLat); + magic = 1 - ee * magic * magic; + var sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI); + dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI); + return {'lat': dLat, 'lon': dLon}; + }, + + //WGS-84 to GCJ-02 + gcj_encrypt: function (wgsLat, wgsLon) { + if (this.outOfChina(wgsLat, wgsLon)) + return {'lat': wgsLat, 'lon': wgsLon}; + + var d = this.delta(wgsLat, wgsLon); + return {'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon}; + }, + //GCJ-02 to WGS-84 + gcj_decrypt: function (gcjLat, gcjLon) { + if (this.outOfChina(gcjLat, gcjLon)) + return {'lat': gcjLat, 'lon': gcjLon}; + + var d = this.delta(gcjLat, gcjLon); + return {'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon}; + }, + //GCJ-02 to WGS-84 exactly + gcj_decrypt_exact: function (gcjLat, gcjLon) { + var initDelta = 0.01; + var threshold = 0.000000001; + var dLat = initDelta, dLon = initDelta; + var mLat = gcjLat - dLat, mLon = gcjLon - dLon; + var pLat = gcjLat + dLat, pLon = gcjLon + dLon; + var wgsLat, wgsLon, i = 0; + while (1) { + wgsLat = (mLat + pLat) / 2; + wgsLon = (mLon + pLon) / 2; + var tmp = this.gcj_encrypt(wgsLat, wgsLon) + dLat = tmp.lat - gcjLat; + dLon = tmp.lon - gcjLon; + if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold)) + break; + + if (dLat > 0) pLat = wgsLat; else mLat = wgsLat; + if (dLon > 0) pLon = wgsLon; else mLon = wgsLon; + + if (++i > 10000) break; + } + return {'lat': wgsLat, 'lon': wgsLon}; + }, + //GCJ-02 to BD-09 + bd_encrypt: function (gcjLat, gcjLon) { + var x = gcjLon, y = gcjLat; + var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * this.x_pi); + bdLon = z * Math.cos(theta) + 0.0065; + bdLat = z * Math.sin(theta) + 0.006; + return {'lat': bdLat, 'lon': bdLon}; + }, + //BD-09 to GCJ-02 + bd_decrypt: function (bdLat, bdLon) { + var x = bdLon - 0.0065, y = bdLat - 0.006; + var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi); + var gcjLon = z * Math.cos(theta); + var gcjLat = z * Math.sin(theta); + return {'lat': gcjLat, 'lon': gcjLon}; + }, + //WGS-84 to Web mercator + //mercatorLat -> y mercatorLon -> x + mercator_encrypt: function (wgsLat, wgsLon) { + var x = wgsLon * 20037508.34 / 180.; + var y = Math.log(Math.tan((90. + wgsLat) * this.PI / 360.)) / (this.PI / 180.); + y = y * 20037508.34 / 180.; + return {'lat': y, 'lon': x}; + }, + // Web mercator to WGS-84 + // mercatorLat -> y mercatorLon -> x + mercator_decrypt: function (mercatorLat, mercatorLon) { + var x = mercatorLon / 20037508.34 * 180.; + var y = mercatorLat / 20037508.34 * 180.; + y = 180 / this.PI * (2 * Math.atan(Math.exp(y * this.PI / 180.)) - this.PI / 2); + return {'lat': y, 'lon': x}; + }, + // two point's distance + distance: function (latA, lonA, latB, lonB) { + var earthR = 6371000.; + var x = Math.cos(latA * this.PI / 180.) * Math.cos(latB * this.PI / 180.) * Math.cos((lonA - lonB) * this.PI / 180); + var y = Math.sin(latA * this.PI / 180.) * Math.sin(latB * this.PI / 180.); + var s = x + y; + if (s > 1) s = 1; + if (s < -1) s = -1; + var alpha = Math.acos(s); + var distance = alpha * earthR; + return distance; + }, + outOfChina: function (lat, lon) { + if (lon < 72.004 || lon > 137.8347) + return true; + if (lat < 0.8293 || lat > 55.8271) + return true; + return false; + }, + transformLat: function (x, y) { + var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0; + return ret; + }, + transformLon: function (x, y) { + var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0; + return ret; + } + }; + var mapStyle = { features: ["road", "building", "water", "land"], // ������������������poi style: "normal" // ������������������������������ @@ -109,9 +232,8 @@ var sensorKey = params['sensorKey']; var unit = params['unit']; var description = params['description']; - var backgroundValue = 32; - - $("#tab").append("<tr><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� + var backgroundValue = ""; + $("#tab").append("<tr><td>������</td><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� var map = new BMap.Map("mapCanvas", {enableMapClick: false}); map.setMapStyle(mapStyle); map.enableScrollWheelZoom(true); // ������������������������ @@ -130,22 +252,30 @@ if (typeof (value.e76) == "undefined" /*|| typeof (value.e78) == "undefined"*/) { showNoDroppoint(); } else { - var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)).toFixed(4); - var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)).toFixed(4); + var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)); + var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)); if (lon < 70 || lon > 150 || lat > 60 || lat <= 0) { return true; } + var lon1 = GPS.gcj_encrypt(lat, lon).lon; + var lat1 = GPS.gcj_encrypt(lat, lon).lat; + var lon2 = GPS.bd_encrypt(lat1, lon1).lon; + var lat2 = GPS.bd_encrypt(lat1, lon1).lat; //var heigh = parseFloat(value.e78.substr(0, value.e78.length - 1)); var heigh = typeof (value.e78) == "undefined" ? "" : parseFloat(value.e78.substr(0, value.e78.length - 1)); var concentration = ""; + var time=""; $.each(value, function (key, data) { if (key == sensorKey) { concentration = data == "undefined" ? "" : parseFloat(data.substr(0, data.length - 1)); } + if (key == "time") { + time = data.toString().split(" ")[1]; + } }); - var point = new BMap.Point(lon, lat); + var point = new BMap.Point(lon2, lat2); trackPoints.push(point); - $("#tab").append("<tr><td>" + lon + "</td><td>" + lat + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� + $("#tab").append("<tr><td>" + time + "</td>" + "<td>" + lon2.toFixed(4) + "</td><td>" + lat2.toFixed(4) + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� /*var myIcon = ""; if (concentration > 23) { @@ -159,6 +289,9 @@ } } ) + if(trackPoints.length==0){ + showNoDroppoint(); + } map.centerAndZoom(trackPoints, 17);// ������������������������������������ map.setViewport(trackPoints);// ������������������������������������������������������ var polygon = new BMap.Polygon(trackPoints, {strokeColor: "none",fillColor:"red", strokeWeight: 2, strokeOpacity: 1}); //��������������� diff --git a/src/main/webapp/view/uavdroppoint.jsp b/src/main/webapp/view/uavdroppoint.jsp index 63d51bd..dbc5e1d 100644 --- a/src/main/webapp/view/uavdroppoint.jsp +++ b/src/main/webapp/view/uavdroppoint.jsp @@ -64,10 +64,6 @@ border: 2px solid red; } - .trr { - border-collapse: collapse; - } - .trr th, td { border: 1px solid black; text-align: center; @@ -83,11 +79,9 @@ <script type="text/javascript" src="../js/jquery.min.js"></script> </head> <body> - <div id="data"> <%--������������������--%> - <table id="tab" style="border:1px solid black;width: 280px"> - </table> + <table id="tab" style="border:1px solid black;width: 280px"></table> </div> <div class="main_body"> <div id="cpm">������������</div> @@ -100,6 +94,135 @@ </body> </html> <script type="text/javascript"> + /* + ��������������� + * */ + var GPS = { + PI: 3.14159265358979324, + x_pi: 3.14159265358979324 * 3000.0 / 180.0, + delta: function (lat, lon) { + var a = 6378245.0; // a: ������������������������������������������������������������������ + var ee = 0.00669342162296594323; // ee: ��������������������� + var dLat = this.transformLat(lon - 105.0, lat - 35.0); + var dLon = this.transformLon(lon - 105.0, lat - 35.0); + var radLat = lat / 180.0 * this.PI; + var magic = Math.sin(radLat); + magic = 1 - ee * magic * magic; + var sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI); + dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI); + return {'lat': dLat, 'lon': dLon}; + }, + + //WGS-84 to GCJ-02 + gcj_encrypt: function (wgsLat, wgsLon) { + if (this.outOfChina(wgsLat, wgsLon)) + return {'lat': wgsLat, 'lon': wgsLon}; + + var d = this.delta(wgsLat, wgsLon); + return {'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon}; + }, + //GCJ-02 to WGS-84 + gcj_decrypt: function (gcjLat, gcjLon) { + if (this.outOfChina(gcjLat, gcjLon)) + return {'lat': gcjLat, 'lon': gcjLon}; + + var d = this.delta(gcjLat, gcjLon); + return {'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon}; + }, + //GCJ-02 to WGS-84 exactly + gcj_decrypt_exact: function (gcjLat, gcjLon) { + var initDelta = 0.01; + var threshold = 0.000000001; + var dLat = initDelta, dLon = initDelta; + var mLat = gcjLat - dLat, mLon = gcjLon - dLon; + var pLat = gcjLat + dLat, pLon = gcjLon + dLon; + var wgsLat, wgsLon, i = 0; + while (1) { + wgsLat = (mLat + pLat) / 2; + wgsLon = (mLon + pLon) / 2; + var tmp = this.gcj_encrypt(wgsLat, wgsLon) + dLat = tmp.lat - gcjLat; + dLon = tmp.lon - gcjLon; + if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold)) + break; + + if (dLat > 0) pLat = wgsLat; else mLat = wgsLat; + if (dLon > 0) pLon = wgsLon; else mLon = wgsLon; + + if (++i > 10000) break; + } + return {'lat': wgsLat, 'lon': wgsLon}; + }, + //GCJ-02 to BD-09 + bd_encrypt: function (gcjLat, gcjLon) { + var x = gcjLon, y = gcjLat; + var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * this.x_pi); + bdLon = z * Math.cos(theta) + 0.0065; + bdLat = z * Math.sin(theta) + 0.006; + return {'lat': bdLat, 'lon': bdLon}; + }, + //BD-09 to GCJ-02 + bd_decrypt: function (bdLat, bdLon) { + var x = bdLon - 0.0065, y = bdLat - 0.006; + var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi); + var gcjLon = z * Math.cos(theta); + var gcjLat = z * Math.sin(theta); + return {'lat': gcjLat, 'lon': gcjLon}; + }, + //WGS-84 to Web mercator + //mercatorLat -> y mercatorLon -> x + mercator_encrypt: function (wgsLat, wgsLon) { + var x = wgsLon * 20037508.34 / 180.; + var y = Math.log(Math.tan((90. + wgsLat) * this.PI / 360.)) / (this.PI / 180.); + y = y * 20037508.34 / 180.; + return {'lat': y, 'lon': x}; + }, + // Web mercator to WGS-84 + // mercatorLat -> y mercatorLon -> x + mercator_decrypt: function (mercatorLat, mercatorLon) { + var x = mercatorLon / 20037508.34 * 180.; + var y = mercatorLat / 20037508.34 * 180.; + y = 180 / this.PI * (2 * Math.atan(Math.exp(y * this.PI / 180.)) - this.PI / 2); + return {'lat': y, 'lon': x}; + }, + // two point's distance + distance: function (latA, lonA, latB, lonB) { + var earthR = 6371000.; + var x = Math.cos(latA * this.PI / 180.) * Math.cos(latB * this.PI / 180.) * Math.cos((lonA - lonB) * this.PI / 180); + var y = Math.sin(latA * this.PI / 180.) * Math.sin(latB * this.PI / 180.); + var s = x + y; + if (s > 1) s = 1; + if (s < -1) s = -1; + var alpha = Math.acos(s); + var distance = alpha * earthR; + return distance; + }, + outOfChina: function (lat, lon) { + if (lon < 72.004 || lon > 137.8347) + return true; + if (lat < 0.8293 || lat > 55.8271) + return true; + return false; + }, + transformLat: function (x, y) { + var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0; + return ret; + }, + transformLon: function (x, y) { + var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0; + return ret; + } + }; + var mapStyle = { features: ["road", "building", "water", "land"], // ������������������poi style: "normal" // ������������������������������ @@ -110,8 +233,7 @@ var unit = params['unit']; var description = params['description']; var backgroundValue = 32; - - $("#tab").append("<tr><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� + $("#tab").append("<tr><td>������</td><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� var map = new BMap.Map("mapCanvas", {enableMapClick: false}); map.setMapStyle(mapStyle); map.enableScrollWheelZoom(true); // ������������������������ @@ -130,22 +252,30 @@ if (typeof (value.e76) == "undefined" /*|| typeof (value.e78) == "undefined"*/) { showNoDroppoint(); } else { - var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)).toFixed(4); - var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)).toFixed(4); + var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)); + var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)); if (lon < 70 || lon > 150 || lat > 60 || lat <= 0) { return true; } + var lon1 = GPS.gcj_encrypt(lat, lon).lon; + var lat1 = GPS.gcj_encrypt(lat, lon).lat; + var lon2 = GPS.bd_encrypt(lat1, lon1).lon; + var lat2 = GPS.bd_encrypt(lat1, lon1).lat; //var heigh = parseFloat(value.e78.substr(0, value.e78.length - 1)); var heigh = typeof (value.e78) == "undefined" ? "" : parseFloat(value.e78.substr(0, value.e78.length - 1)); var concentration = ""; + var time = ""; $.each(value, function (key, data) { if (key == sensorKey) { concentration = data == "undefined" ? "" : parseFloat(data.substr(0, data.length - 1)); } + if (key == "time") { + time = data.toString().split(" ")[1]; + } }); - var point = new BMap.Point(lon, lat); + var point = new BMap.Point(lon2, lat2); trackPoints.push(point); - $("#tab").append("<tr><td>" + lon + "</td><td>" + lat + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� + $("#tab").append("<tr><td>" + time + "</td>" + "<td>" + lon2.toFixed(4) + "</td><td>" + lat2.toFixed(4) + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� /* var myIcon = ""; if (concentration > 23) { @@ -159,9 +289,17 @@ } } ) + if(trackPoints.length==0){ + showNoDroppoint(); + } map.centerAndZoom(trackPoints, 17);// ������������������������������������ map.setViewport(trackPoints);// ������������������������������������������������������ - var polygon = new BMap.Polygon(trackPoints, {strokeColor: "none",fillColor:"red", strokeWeight: 2, strokeOpacity: 1}); //��������������� + var polygon = new BMap.Polygon(trackPoints, { + strokeColor: "none", + fillColor: "red", + strokeWeight: 2, + strokeOpacity: 1 + }); //��������������� map.addOverlay(polygon); //��������������� map.setViewport(polygon.getPath()); //������������ } diff --git a/src/main/webapp/view/uavdroppointnew.jsp b/src/main/webapp/view/uavdroppointnew.jsp new file mode 100644 index 0000000..1f035dc --- /dev/null +++ b/src/main/webapp/view/uavdroppointnew.jsp @@ -0,0 +1,450 @@ +<%@ page contentType="text/html;charset=UTF-8" language="java" %> +<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> +<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> +<!DOCTYPE html> +<html> +<head> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> + <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> + <style type="text/css"> + body, + html, + #mapCanvas { + width: 100%; + height: 100%; + overflow: hidden; + margin: 0; + z-index: 0; + font-size: 14px; + font-family: "������������"; + } + + .main_body { + border: 0; + margin: 0; + width: 100%; + height: 100%; + position: relative; + } + + * { + margin: 0; + 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; + } + + #data { + overflow: scroll; + width: 300px; + height: 400px; + top: 20px; + right: 5px; + position: absolute; + z-index: 1; + background-color: gainsboro; + opacity: 0.8; + border: 2px solid red; + } + + .trr th, td { + border: 1px solid black; + text-align: center; + } + + table { + border-collapse: collapse; + font-size: 12px; + } + + #details { + position: absolute; + z-index: 1; + width: 100px; + height: 30px; + right: 100px; + bottom: 5px; + font-size: 100%; + } + + #form { + position: absolute; + z-index: 1; + width: 100px; + height: 30px; + right: 200px; + bottom: 5px; + font-size: 100%; + } + </style> + <script type="text/javascript" + src="http://api.map.baidu.com/api?v=2.0&ak=dmzBXk6VTBG1SKUvqSSEgGBU8HcuoajQ"></script> + <script type="text/javascript" src="../js/jquery.min.js"></script> +</head> +<body> + +<div id="data" style="display: none"> + <%--������������������--%> + <table id="tab" style="border:1px solid black;width: 280px"> + </table> +</div> + +<form id="form"> + <label> + <select id="select"><!--������������--> + <option value="zero" selected>������</option> + <option value="one">0-20m</option> + <option value="two">21-40m</option> + <option value="three">41-60m</option><!--���������������������������������������--> + <option value="four">61-80m</option> + <option value="five">80m������</option> + </select> + </label> +</form> +<button id="details" onclick="show()">������������</button> +<div class="main_body"> + <div id="cpm">������������</div> + <div id="mapCanvas"></div> <!-- ������������������--> + <!-- ���sensorInfo,regionCode,regionName,monitorPoint,device--> + <div id="uavDroppointParams" style="display: none;"> + ${requestScope.uavDroppointParams} + </div> +</div> +</body> +</html> +<script type="text/javascript"> + function show() { + $("#data").toggle(); + } + + /* + ��������������� + * */ + var GPS = { + PI: 3.14159265358979324, + x_pi: 3.14159265358979324 * 3000.0 / 180.0, + delta: function (lat, lon) { + var a = 6378245.0; // a: ������������������������������������������������������������������ + var ee = 0.00669342162296594323; // ee: ��������������������� + var dLat = this.transformLat(lon - 105.0, lat - 35.0); + var dLon = this.transformLon(lon - 105.0, lat - 35.0); + var radLat = lat / 180.0 * this.PI; + var magic = Math.sin(radLat); + magic = 1 - ee * magic * magic; + var sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI); + dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI); + return {'lat': dLat, 'lon': dLon}; + }, + + //WGS-84 to GCJ-02 + gcj_encrypt: function (wgsLat, wgsLon) { + if (this.outOfChina(wgsLat, wgsLon)) + return {'lat': wgsLat, 'lon': wgsLon}; + + var d = this.delta(wgsLat, wgsLon); + return {'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon}; + }, + //GCJ-02 to WGS-84 + gcj_decrypt: function (gcjLat, gcjLon) { + if (this.outOfChina(gcjLat, gcjLon)) + return {'lat': gcjLat, 'lon': gcjLon}; + + var d = this.delta(gcjLat, gcjLon); + return {'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon}; + }, + //GCJ-02 to WGS-84 exactly + gcj_decrypt_exact: function (gcjLat, gcjLon) { + var initDelta = 0.01; + var threshold = 0.000000001; + var dLat = initDelta, dLon = initDelta; + var mLat = gcjLat - dLat, mLon = gcjLon - dLon; + var pLat = gcjLat + dLat, pLon = gcjLon + dLon; + var wgsLat, wgsLon, i = 0; + while (1) { + wgsLat = (mLat + pLat) / 2; + wgsLon = (mLon + pLon) / 2; + var tmp = this.gcj_encrypt(wgsLat, wgsLon) + dLat = tmp.lat - gcjLat; + dLon = tmp.lon - gcjLon; + if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold)) + break; + + if (dLat > 0) pLat = wgsLat; else mLat = wgsLat; + if (dLon > 0) pLon = wgsLon; else mLon = wgsLon; + + if (++i > 10000) break; + } + return {'lat': wgsLat, 'lon': wgsLon}; + }, + //GCJ-02 to BD-09 + bd_encrypt: function (gcjLat, gcjLon) { + var x = gcjLon, y = gcjLat; + var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * this.x_pi); + bdLon = z * Math.cos(theta) + 0.0065; + bdLat = z * Math.sin(theta) + 0.006; + return {'lat': bdLat, 'lon': bdLon}; + }, + //BD-09 to GCJ-02 + bd_decrypt: function (bdLat, bdLon) { + var x = bdLon - 0.0065, y = bdLat - 0.006; + var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi); + var gcjLon = z * Math.cos(theta); + var gcjLat = z * Math.sin(theta); + return {'lat': gcjLat, 'lon': gcjLon}; + }, + //WGS-84 to Web mercator + //mercatorLat -> y mercatorLon -> x + mercator_encrypt: function (wgsLat, wgsLon) { + var x = wgsLon * 20037508.34 / 180.; + var y = Math.log(Math.tan((90. + wgsLat) * this.PI / 360.)) / (this.PI / 180.); + y = y * 20037508.34 / 180.; + return {'lat': y, 'lon': x}; + }, + // Web mercator to WGS-84 + // mercatorLat -> y mercatorLon -> x + mercator_decrypt: function (mercatorLat, mercatorLon) { + var x = mercatorLon / 20037508.34 * 180.; + var y = mercatorLat / 20037508.34 * 180.; + y = 180 / this.PI * (2 * Math.atan(Math.exp(y * this.PI / 180.)) - this.PI / 2); + return {'lat': y, 'lon': x}; + }, + // two point's distance + distance: function (latA, lonA, latB, lonB) { + var earthR = 6371000.; + var x = Math.cos(latA * this.PI / 180.) * Math.cos(latB * this.PI / 180.) * Math.cos((lonA - lonB) * this.PI / 180); + var y = Math.sin(latA * this.PI / 180.) * Math.sin(latB * this.PI / 180.); + var s = x + y; + if (s > 1) s = 1; + if (s < -1) s = -1; + var alpha = Math.acos(s); + var distance = alpha * earthR; + return distance; + }, + outOfChina: function (lat, lon) { + if (lon < 72.004 || lon > 137.8347) + return true; + if (lat < 0.8293 || lat > 55.8271) + return true; + return false; + }, + transformLat: function (x, y) { + var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0; + return ret; + }, + transformLon: function (x, y) { + var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0; + return ret; + } + }; + + var mapStyle = { + features: ["road", "building", "water", "land"], // ������������������poi + style: "normal" // ������������������������������ + }; + var params = $.parseJSON($("#uavDroppointParams").html()); + var sensorInfo = params["sensorInfo"]; + var sensorKey = params['sensorKey']; + var unit = params['unit']; + var description = params['description']; + var backgroundValue = ""; + + $("#tab").append("<tr><td>������</td><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� + var map = new BMap.Map("mapCanvas", {enableMapClick: false}); + map.setMapStyle(mapStyle); + map.enableScrollWheelZoom(true); // ������������������������ + var navigation = new BMap.NavigationControl({ + anchor: BMAP_ANCHOR_BOTTOM_RIGHT, + type: BMAP_NAVIGATION_CONTROL_LARGE + }); + var mapType = new BMap.MapTypeControl( + { + mapTypes: [BMAP_HYBRID_MAP, BMAP_NORMAL_MAP], + anchor: BMAP_ANCHOR_TOP_LEFT + } + ); + map.addControl(navigation); + map.addControl(mapType); + map.setMapType(BMAP_HYBRID_MAP); + map.addControl(new BMap.ScaleControl()); + if (sensorInfo.length == 0) { + showNoDroppoint(); + } + var trackPoints = []; + var trackPointsOne = []; + var trackPointsTwo = []; + var trackPointsThree = []; + var trackPointsFour = []; + var trackPointsFive = []; + if (sensorInfo.length > 0) { + $.each(sensorInfo, function (item, value) { + if (typeof (value.e76) == "undefined" /*|| typeof (value.e78) == "undefined"*/) { + showNoDroppoint(); + } else { + var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)); + var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)); + if (lon < 70 || lon > 150 || lat > 60 || lat <= 0) { + return true; + } + var lon1 = GPS.gcj_encrypt(lat, lon).lon; + var lat1 = GPS.gcj_encrypt(lat, lon).lat; + var lon2 = GPS.bd_encrypt(lat1, lon1).lon; + var lat2 = GPS.bd_encrypt(lat1, lon1).lat; + //var heigh = parseFloat(value.e78.substr(0, value.e78.length - 1)); + var heigh = typeof (value.e78) == "undefined" ? "" : parseFloat(value.e78.substr(0, value.e78.length - 1)); + var concentration = ""; + var time = ""; + $.each(value, function (key, data) { + if (key == sensorKey) { + concentration = data == "undefined" ? "" : parseFloat(data.substr(0, data.length - 1)); + } + if (key == "time") { + time = data.toString().split(" ")[1]; + } + }); + var point = new BMap.Point(lon2, lat2); + var hashMap = new Map(); + hashMap.set("time", time); + hashMap.set("point", point); + hashMap.set("heigh", heigh); + hashMap.set("concentration", concentration); + if (heigh > 0 && heigh <= 20) { + trackPointsOne.push(hashMap); + } else if (heigh >= 21 && heigh <= 40) { + trackPointsTwo.push(hashMap); + } else if (heigh >= 41 && heigh <= 60) { + trackPointsThree.push(hashMap); + } else if (heigh >= 61 && heigh <= 80) { + trackPointsFour.push(hashMap); + } else if (heigh >= 81) { + trackPointsFive.push(hashMap); + } + trackPoints.push(hashMap); + $("#tab").append("<tr><td>" + time + "</td>" + "<td>" + lon2.toFixed(4) + "</td><td>" + lat2.toFixed(4) + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� + } + }); + } + if (trackPoints.length == 0) { + showNoDroppoint(); + } + + $(function () { + var points = getPoints(trackPoints); + map.centerAndZoom(points, 17);// ������������������������������������ + map.setViewport(points);// ������������������������������������������������������ + listen(trackPoints); + $("#select").change(function () { + map.clearOverlays(); + var val = $("#select").val(); + var arry = ""; + if (val == "one") { + arry = trackPointsOne; + } else if (val == "two") { + arry = trackPointsTwo; + } else if (val == "three") { + arry = trackPointsThree; + } else if (val == "four") { + arry = trackPointsFour; + } else if (val == "five") { + arry = trackPointsFive; + } else if (val == "zero") { + arry = trackPoints; + } + var zoom = map.getZoom(); + if (zoom > 17) { + addMarkers(arry); + } + addPolygon(getPoints(arry)); + listen(arry); + }) + }); + + function listen(arry) { + map.addEventListener("zoomend", function () { + var points = getPoints(arry); + var zoom = map.getZoom(); + map.clearOverlays(); + if (zoom > 17) { + addMarkers(arry); + } + addPolygon(points); + }); + } + + function addMarkers(arry) { + $.each(arry, function (item, value) { + var myIcon = new BMap.Icon('/img/uav_red.png', new BMap.Size(50, 50)); + var time = value.get("time"); + var heigh = value.get("heigh"); + var concentration = value.get("concentration"); + var point = value.get("point"); + var marker = new BMap.Marker(point, {icon: myIcon}); + map.addOverlay(marker); + var lon = marker.getPosition().lng; + var lat = marker.getPosition().lat; + var opts = { + width: 200, // ������������������ + height: 100, // ������������������ + } + var infoWindow = new BMap.InfoWindow("������: " + time + "</br>������: " + lon.toFixed(4) + "��</br>������: " + lat.toFixed(4) + "��</br>������: " + heigh + "m</br>" + description + ": " + concentration + unit, opts); // ������������������������ + if (heigh == "") { + infoWindow = new BMap.InfoWindow("������: " + time + "</br>������: " + lon.toFixed(4) + "��</br>������: " + lat.toFixed(4) + "</br>" + description + ": " + concentration + unit, opts); // ������������������������ + } + marker.addEventListener("click", function () { + map.openInfoWindow(infoWindow, point); //������������������ + }); + }); + } + + function addPolygon(points) { + var polygon = new BMap.Polygon(points, { + strokeColor: "none", + fillColor: "red", + strokeOpacity: 1 + }); //��������������� + map.addOverlay(polygon); //��������������� + } + + function showNoDroppoint() { + var point = new BMap.Point(120.987287, 31.391562); + map.centerAndZoom(point, 17); + setTimeout(function () { + document.getElementById("cpm").style.display = 'block'; + document.getElementById("data").style.display = 'none'; + }, 250); + } + + function getPoints(arry) { + var points = []; + $.each(arry, function (item, value) { + var point = value.get("point"); + points.push(point); + }); + return points; + } +</script> diff --git a/src/main/webapp/view/uavtracing.jsp b/src/main/webapp/view/uavtracing.jsp index b32880c..f526983 100644 --- a/src/main/webapp/view/uavtracing.jsp +++ b/src/main/webapp/view/uavtracing.jsp @@ -4,102 +4,225 @@ <!DOCTYPE html> <html> <head> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> - <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> - <style type="text/css"> - body, - html, - #mapCanvas { - width: 100%; - height: 100%; - overflow: hidden; - margin: 0; - z-index: 0; - font-size: 14px; - font-family: "������������"; - } + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> + <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> + <style type="text/css"> + body, + html, + #mapCanvas { + width: 100%; + height: 100%; + overflow: hidden; + margin: 0; + z-index: 0; + font-size: 14px; + font-family: "������������"; + } - .main_body { - border: 0; - margin: 0; - width: 100%; - height: 100%; - position: relative; - } + .main_body { + border: 0; + margin: 0; + width: 100%; + height: 100%; + position: relative; + } - * { - margin: 0; - padding: 0; - list-style: none; - } + * { + margin: 0; + 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; - } + #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; + } - #data { - overflow: scroll; - width: 300px; - height: 400px; - top: 20px; - right: 5px; - position: absolute; - z-index: 1; - background-color: gainsboro; - opacity: 0.8; - border: 2px solid red; - } + #data { + overflow: scroll; + width: 300px; + height: 400px; + top: 20px; + right: 5px; + position: absolute; + z-index: 1; + background-color: gainsboro; + opacity: 0.8; + border: 2px solid red; + } - .trr { - border-collapse: collapse; - } + .trr th, td { + border: 1px solid black; + text-align: center; + } - .trr th, td { - border: 1px solid black; - text-align: center; - } - - table { - border-collapse: collapse; - font-size: 12px; - } - </style> - <script type="text/javascript" - src="http://api.map.baidu.com/api?v=2.0&ak=dmzBXk6VTBG1SKUvqSSEgGBU8HcuoajQ"></script> - <script type="text/javascript" src="../js/jquery.min.js"></script> + table { + border-collapse: collapse; + font-size: 12px; + } + </style> + <script type="text/javascript" + src="http://api.map.baidu.com/api?v=2.0&ak=dmzBXk6VTBG1SKUvqSSEgGBU8HcuoajQ"></script> + <script type="text/javascript" src="../js/jquery.min.js"></script> </head> <body> - <div id="data"> - <%--������������������--%> - <table id="tab" style="border:1px solid black;width: 280px"> - </table> + <%--������������������--%> + <table id="tab" style="border:1px solid black;width: 280px"></table> </div> <div class="main_body"> - <div id="cpm">������������</div> - <div id="mapCanvas"></div> <!-- ������������������--> - <!-- ���sensorInfo,regionCode,regionName,monitorPoint,device--> - <div id="uavTracingParams" style="display: none;"> - ${requestScope.uavTracingParams} - </div> + <div id="cpm">������������</div> + <div id="mapCanvas"></div> <!-- ������������������--> + <!-- ���sensorInfo,regionCode,regionName,monitorPoint,device--> + <div id="uavTracingParams" style="display: none;"> + ${requestScope.uavTracingParams} + </div> </div> </body> </html> <script type="text/javascript"> + /* + ��������������� + * */ + var GPS = { + PI: 3.14159265358979324, + x_pi: 3.14159265358979324 * 3000.0 / 180.0, + delta: function (lat, lon) { + var a = 6378245.0; // a: ������������������������������������������������������������������ + var ee = 0.00669342162296594323; // ee: ��������������������� + var dLat = this.transformLat(lon - 105.0, lat - 35.0); + var dLon = this.transformLon(lon - 105.0, lat - 35.0); + var radLat = lat / 180.0 * this.PI; + var magic = Math.sin(radLat); + magic = 1 - ee * magic * magic; + var sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI); + dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI); + return {'lat': dLat, 'lon': dLon}; + }, + + //WGS-84 to GCJ-02 + gcj_encrypt: function (wgsLat, wgsLon) { + if (this.outOfChina(wgsLat, wgsLon)) + return {'lat': wgsLat, 'lon': wgsLon}; + + var d = this.delta(wgsLat, wgsLon); + return {'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon}; + }, + //GCJ-02 to WGS-84 + gcj_decrypt: function (gcjLat, gcjLon) { + if (this.outOfChina(gcjLat, gcjLon)) + return {'lat': gcjLat, 'lon': gcjLon}; + + var d = this.delta(gcjLat, gcjLon); + return {'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon}; + }, + //GCJ-02 to WGS-84 exactly + gcj_decrypt_exact: function (gcjLat, gcjLon) { + var initDelta = 0.01; + var threshold = 0.000000001; + var dLat = initDelta, dLon = initDelta; + var mLat = gcjLat - dLat, mLon = gcjLon - dLon; + var pLat = gcjLat + dLat, pLon = gcjLon + dLon; + var wgsLat, wgsLon, i = 0; + while (1) { + wgsLat = (mLat + pLat) / 2; + wgsLon = (mLon + pLon) / 2; + var tmp = this.gcj_encrypt(wgsLat, wgsLon) + dLat = tmp.lat - gcjLat; + dLon = tmp.lon - gcjLon; + if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold)) + break; + + if (dLat > 0) pLat = wgsLat; else mLat = wgsLat; + if (dLon > 0) pLon = wgsLon; else mLon = wgsLon; + + if (++i > 10000) break; + } + return {'lat': wgsLat, 'lon': wgsLon}; + }, + //GCJ-02 to BD-09 + bd_encrypt: function (gcjLat, gcjLon) { + var x = gcjLon, y = gcjLat; + var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * this.x_pi); + bdLon = z * Math.cos(theta) + 0.0065; + bdLat = z * Math.sin(theta) + 0.006; + return {'lat': bdLat, 'lon': bdLon}; + }, + //BD-09 to GCJ-02 + bd_decrypt: function (bdLat, bdLon) { + var x = bdLon - 0.0065, y = bdLat - 0.006; + var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi); + var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi); + var gcjLon = z * Math.cos(theta); + var gcjLat = z * Math.sin(theta); + return {'lat': gcjLat, 'lon': gcjLon}; + }, + //WGS-84 to Web mercator + //mercatorLat -> y mercatorLon -> x + mercator_encrypt: function (wgsLat, wgsLon) { + var x = wgsLon * 20037508.34 / 180.; + var y = Math.log(Math.tan((90. + wgsLat) * this.PI / 360.)) / (this.PI / 180.); + y = y * 20037508.34 / 180.; + return {'lat': y, 'lon': x}; + }, + // Web mercator to WGS-84 + // mercatorLat -> y mercatorLon -> x + mercator_decrypt: function (mercatorLat, mercatorLon) { + var x = mercatorLon / 20037508.34 * 180.; + var y = mercatorLat / 20037508.34 * 180.; + y = 180 / this.PI * (2 * Math.atan(Math.exp(y * this.PI / 180.)) - this.PI / 2); + return {'lat': y, 'lon': x}; + }, + // two point's distance + distance: function (latA, lonA, latB, lonB) { + var earthR = 6371000.; + var x = Math.cos(latA * this.PI / 180.) * Math.cos(latB * this.PI / 180.) * Math.cos((lonA - lonB) * this.PI / 180); + var y = Math.sin(latA * this.PI / 180.) * Math.sin(latB * this.PI / 180.); + var s = x + y; + if (s > 1) s = 1; + if (s < -1) s = -1; + var alpha = Math.acos(s); + var distance = alpha * earthR; + return distance; + }, + outOfChina: function (lat, lon) { + if (lon < 72.004 || lon > 137.8347) + return true; + if (lat < 0.8293 || lat > 55.8271) + return true; + return false; + }, + transformLat: function (x, y) { + var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0; + return ret; + }, + transformLon: function (x, y) { + var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0; + ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0; + return ret; + } + }; + var mapStyle = { features: ["road", "building", "water", "land"], // ������������������poi style: "normal" // ������������������������������ @@ -109,9 +232,8 @@ var sensorKey = params['sensorKey']; var unit = params['unit']; var description = params['description']; - var backgroundValue = 32; - - $("#tab").append("<tr><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� + var backgroundValue = ""; + $("#tab").append("<tr><td>������</td><td>������(��)</td><td>������(��)</td><td>������(m)</td><td>" + description + "(" + unit + ")</td></tr>");//��������������������������� var map = new BMap.Map("mapCanvas", {enableMapClick: false}); map.setMapStyle(mapStyle); map.enableScrollWheelZoom(true); // ������������������������ @@ -130,41 +252,53 @@ if (typeof (value.e76) == "undefined" /*|| typeof (value.e78) == "undefined"*/) { showNoDroppoint(); } else { - var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)).toFixed(4); - var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)).toFixed(4); + var lon = parseFloat(value.e76.substr(0, value.e76.length - 1)); + var lat = parseFloat(value.e77.substr(0, value.e77.length - 1)); if (lon < 70 || lon > 150 || lat > 60 || lat <= 0) { return true; } + var lon1 = GPS.gcj_encrypt(lat, lon).lon; + var lat1 = GPS.gcj_encrypt(lat, lon).lat; + var lon2 = GPS.bd_encrypt(lat1, lon1).lon; + var lat2 = GPS.bd_encrypt(lat1, lon1).lat; //var heigh = parseFloat(value.e78.substr(0, value.e78.length - 1)); var heigh = typeof (value.e78) == "undefined" ? "" : parseFloat(value.e78.substr(0, value.e78.length - 1)); var concentration = ""; + var time=""; $.each(value, function (key, data) { if (key == sensorKey) { concentration = data == "undefined" ? "" : parseFloat(data.substr(0, data.length - 1)); } + if (key == "time") { + time = data.toString().split(" ")[1]; + } }); - var point = new BMap.Point(lon, lat); + var point = new BMap.Point(lon2, lat2); trackPoints.push(point); - $("#tab").append("<tr><td>" + lon + "</td><td>" + lat + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� + $("#tab").append("<tr><td>" + time + "</td>" + "<td>" + lon2.toFixed(4) + "</td><td>" + lat2.toFixed(4) + "</td><td>" + heigh + "</td><td>" + concentration + "</td></tr>");//��������������������������� - /* var myIcon = ""; - if (concentration > 23) { - myIcon = new BMap.Icon('/img/uav_red.png', new BMap.Size(20, 20)); - trackPoints.push(point); - } else if (concentration == 23) { - myIcon = new BMap.Icon('/img/uav_green.png', new BMap.Size(20, 20)); - } else { - return true; - }*/ + /*var myIcon = ""; + if (concentration > 23) { + myIcon = new BMap.Icon('/img/uav_red.png', new BMap.Size(20, 20)); + trackPoints.push(point); + } else if (concentration == 23) { + myIcon = new BMap.Icon('/img/uav_green.png', new BMap.Size(20, 20)); + } else { + return true; + }*/ } } ) + if(trackPoints.length==0){ + showNoDroppoint(); + } map.centerAndZoom(trackPoints, 17);// ������������������������������������ map.setViewport(trackPoints);// ������������������������������������������������������ var polygon = new BMap.Polygon(trackPoints, {strokeColor: "none",fillColor:"red", strokeWeight: 2, strokeOpacity: 1}); //��������������� map.addOverlay(polygon); //��������������� map.setViewport(polygon.getPath()); //������������ } + function showNoDroppoint() { var point = new BMap.Point(120.987287, 31.391562); map.centerAndZoom(point, 17); -- Gitblit v1.8.0