| | |
| | | |
| | | <body> |
| | | <div class="main_body"> |
| | | <input type="button" id="show" value="计算"/> |
| | | <input type="button" id="show" value="溯源"/> |
| | | <div id="cpm">无法推测来源</div> |
| | | <div id="mapCanvas"></div> <!-- 百度地图 --> |
| | | <!-- 传sensorInfo,regionCode,regionName,monitorPoint,device--> |
| | |
| | | var marker = new BMap.Marker(point, {icon: icon, offset: new BMap.Size(0, -20)}); |
| | | map.addOverlay(marker); |
| | | map.centerAndZoom(point, 16); |
| | | |
| | | if (!$.isEmptyObject(dirPoint) && !$.isEmptyObject(getPollutionSourceData) && typeof (getPollutionSourceData["e6"]) != "undefined" && typeof (getPollutionSourceData["e7"]) != "undefined" && typeof (getPollutionSourceData["e18"]) != "undefined" && typeof (getPollutionSourceData["e23"]) != "undefined" && getPollutionSourceData["e18"] > 0.03) { |
| | | var windSpeed = parseFloat(getPollutionSourceData["e18"]); |
| | | var windDir = parseFloat(getPollutionSourceData["e23"]); |
| | | var distance = windSpeed * 3600; |
| | | var winDirStart = 255 - windDir; |
| | | var winDirEnd = 285 - windDir; |
| | | var marker1 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.15, winDirStart), { |
| | | icon: icon2, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker2 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.31, winDirEnd), { |
| | | icon: icon2, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker3 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.61, winDirStart), { |
| | | icon: icon1, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker4 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.78, winDirEnd), { |
| | | icon: icon1, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | map.addOverlay(marker1); |
| | | map.addOverlay(marker2); |
| | | map.addOverlay(marker3); |
| | | map.addOverlay(marker4); |
| | | } |
| | | |
| | | $("#show").one('click', function () { |
| | | setTimeout(function () { |
| | |
| | | var temperature = parseFloat(getPollutionSourceData["e7"]); |
| | | var windSpeed = parseFloat(getPollutionSourceData["e18"]); |
| | | var windDir = parseFloat(getPollutionSourceData["e23"]); |
| | | var iconDir = new BMap.Icon("/img/ico07.gif", new BMap.Size(50, 50)); |
| | | var markerDir = new BMap.Marker(dirPoint, {icon: iconDir, offset: new BMap.Size(0, -20)}); |
| | | |
| | | //centre:椭圆中心点,X:横向经度,Y:纵向纬度 |
| | | function add_oval(centre, x, y) { |
| | | var assemble = new Array(); |
| | | var angle; |
| | | var dot; |
| | | var tangent = x / y; |
| | | for (i = 0; i < 36; i++) { |
| | | angle = (2 * Math.PI / 36) * i; |
| | | dot = new BMap.Point(centre.lng + Math.sin(angle) * y * tangent, centre.lat + Math.cos(angle) * y); |
| | | assemble.push(dot); |
| | | } |
| | | return assemble; |
| | | } |
| | | |
| | | //以画多边形区域的方法画扇形区域 画出以point点为圆心,半径为radius,夹角从sDegree到eDegree的扇形 |
| | | function Sector(point, radius, sDegree, eDegree) { |
| | | var points = []; //创建构成多边形的点数组 |
| | | var step = ((eDegree - sDegree) / 100) || 1; //根据扇形的总夹角确定每步夹角度数,最大为10 |
| | | points.push(point); |
| | | for (var i = sDegree; i < eDegree + 0.001; i += step) { //循环获取每步的圆弧上点的坐标,存入点数组 |
| | | points.push(EOffsetBearing(point, radius, i)); |
| | | } |
| | | points.push(point); |
| | | return points; |
| | | } |
| | | |
| | | //使用数学的方法计算需要画扇形的圆弧上的点坐标 |
| | | function EOffsetBearing(point, dist, bearing) { |
| | | var lngConv = map.getDistance(point, new BMap.Point(point.lng + 0.1, point.lat)) * 10; //计算经度与原点的距离 |
| | | var latConv = map.getDistance(point, new BMap.Point(point.lng, point.lat + 0.1)) * 10; //计算纬度与原点的距离 |
| | | var lat = dist * Math.sin(bearing * Math.PI / 180) / latConv; //正弦计算待获取的点的纬度与原点纬度差 |
| | | var lng = dist * Math.cos(bearing * Math.PI / 180) / lngConv; //余弦计算待获取的点的经度与原点经度差 |
| | | return new BMap.Point(point.lng + lng, point.lat + lat); |
| | | } |
| | | var selectSensorKey = getPollutionSourceData["selectSensorKey"]; |
| | | var markerDir = new BMap.Marker(dirPoint); |
| | | lab = new BMap.Label("该坐标点分析为溯源</br>" + selectSensorKey + "浓度超标", { |
| | | position: dirPoint, |
| | | offset: new BMap.Size(20, -40) |
| | | }); |
| | | lab.setStyle({ |
| | | color: "#EE3B3B", |
| | | fontSize: "16px", |
| | | backgroundColor: "1", |
| | | fontWeight: "bold" |
| | | }); |
| | | map.addOverlay(lab); |
| | | |
| | | var distance = windSpeed * 3600; |
| | | var winDirStartLeft = 240 - windDir; |
| | |
| | | ], |
| | | {strokeColor: "red", strokeWeight: 4, strokeOpacity: 1} |
| | | ); |
| | | map.addOverlay(polyline1);// 画两点间线 |
| | | map.addOverlay(polyline2);// 画两点间线 |
| | | map.addOverlay(markerDir); |
| | | setTimeout(function () { |
| | | var ovalLeft = new BMap.Polygon(Sector(dirPoint, distance, winDirStartLeft, winDirEndLeft), { |
| | | strokeColor: "#ADADAD", |
| | |
| | | fillColor: "#ADADAD" |
| | | }); |
| | | map.addOverlay(ovalRight); |
| | | map.addOverlay(markerDir); |
| | | var marker1 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.15, winDirStart), { |
| | | icon: icon2, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker2 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.31, winDirEnd), { |
| | | icon: icon2, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker3 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.61, winDirStart), { |
| | | icon: icon1, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | var marker4 = new BMap.Marker(EOffsetBearing(dirPoint, distance * 0.78, winDirEnd), { |
| | | icon: icon1, |
| | | offset: new BMap.Size(0, -20) |
| | | }); |
| | | map.addOverlay(marker1); |
| | | map.addOverlay(marker2); |
| | | map.addOverlay(marker3); |
| | | map.addOverlay(marker4); |
| | | map.addOverlay(oval); |
| | | map.addOverlay(polyline1);// 画两点间线 |
| | | map.addOverlay(polyline2);// 画两点间线 |
| | | }, 500); |
| | | |
| | | var winfowTextCause = "<p style='height: 44px;line-height: 22px'>汽车尾气,工厂废气,以及周边地区农田秸秆焚烧,污染传播途径是根据风向来做出调整</p>"; |
| | |
| | | var infoWindow = new BMap.InfoWindow(winfowText, opts); |
| | | this.openInfoWindow(infoWindow); |
| | | }); |
| | | } |
| | | }, 1500); |
| | | }); |
| | | |
| | | //centre:椭圆中心点,X:横向经度,Y:纵向纬度 |
| | | function add_oval(centre, x, y) { |
| | | var assemble = new Array(); |
| | | var angle; |
| | | var dot; |
| | | var tangent = x / y; |
| | | for (i = 0; i < 36; i++) { |
| | | angle = (2 * Math.PI / 36) * i; |
| | | dot = new BMap.Point(centre.lng + Math.sin(angle) * y * tangent, centre.lat + Math.cos(angle) * y); |
| | | assemble.push(dot); |
| | | } |
| | | return assemble; |
| | | } |
| | | |
| | | //以画多边形区域的方法画扇形区域 画出以point点为圆心,半径为radius,夹角从sDegree到eDegree的扇形 |
| | | function Sector(point, radius, sDegree, eDegree) { |
| | | var points = []; //创建构成多边形的点数组 |
| | | var step = ((eDegree - sDegree) / 100) || 1; //根据扇形的总夹角确定每步夹角度数,最大为10 |
| | | points.push(point); |
| | | for (var i = sDegree; i < eDegree + 0.001; i += step) { //循环获取每步的圆弧上点的坐标,存入点数组 |
| | | points.push(EOffsetBearing(point, radius, i)); |
| | | } |
| | | points.push(point); |
| | | return points; |
| | | } |
| | | |
| | | //使用数学的方法计算需要画扇形的圆弧上的点坐标 |
| | | function EOffsetBearing(point, dist, bearing) { |
| | | var lngConv = map.getDistance(point, new BMap.Point(point.lng + 0.1, point.lat)) * 10; //计算经度与原点的距离 |
| | | var latConv = map.getDistance(point, new BMap.Point(point.lng, point.lat + 0.1)) * 10; //计算纬度与原点的距离 |
| | | var lat = dist * Math.sin(bearing * Math.PI / 180) / latConv; //正弦计算待获取的点的纬度与原点纬度差 |
| | | var lng = dist * Math.cos(bearing * Math.PI / 180) / lngConv; //余弦计算待获取的点的经度与原点经度差 |
| | | return new BMap.Point(point.lng + lng, point.lat + lat); |
| | | } |
| | | |
| | | function addArrow(polyline, length, angleValue, temperature, humidity, windSpeed, windDir) { |
| | |
| | | document.getElementById("cpm").style.display = 'block'; |
| | | }, 250); |
| | | }; |
| | | }, 1500); |
| | | }); |
| | | |
| | | </script> |