重合点改为聚合图片，调整重合数量显示位置

ZhuDongming

2019-08-06 28e9535f217b2965515ffb959bacc23234d17aca

 src/main/webapp/view/uavTrajectory.jsp

@@ -136,9 +136,10 @@
            );
            if (i < trackPoints.length - 1) {
                map.addOverlay(polyline);// 画两点间线
                if (i != 0) {
                    addArrow(polyline, arrowLength, Math.PI / 7);
                if (i == 0) {
                    map.centerAndZoom(startPoint, 17);
                }
                addArrow(polyline, arrowLength, Math.PI / 7);
            }
            if (coincidentPoints.indexOf(i) > -1) {
                //判断是否已经已经显示过该点的信息，避免重复。
@@ -147,8 +148,8 @@

            var startIcon = new BMap.Icon("/img/start.png", new BMap.Size(48, 48));
            var endIcon = new BMap.Icon("/img/end.png", new BMap.Size(48, 48));
            var aggregationIcon = new BMap.Icon("/img/aggregation.png", new BMap.Size(48, 48));
            if (i == 0) {
                map.centerAndZoom(startPoint, 17);
                marker = new BMap.Marker(startPoint, {icon: startIcon, offset: new BMap.Size(0, -20)});
            }
            if (i == trackPoints.length - 1) {
@@ -158,7 +159,8 @@
                marker = new BMap.Marker(startPoint);
            }
            var count = 0;
            var winfowText = "";
            var winfowText =
                '<div style="min-height:20px;overflow-y:auto;max-height:400px;" >';
            for (var j = i + 1; j < trackPoints.length; j++) {
                distance = map.getDistance(trackPoints[i], trackPoints[j]).toFixed(5);
                if (distance <= 1.9) {
@@ -167,24 +169,22 @@
                    }
                    coincidentPoints.push(j);
                    count++;
                    marker = new BMap.Marker(startPoint, {icon: aggregationIcon});
                    winfowTextAdd = '<p id="' + j + '" onclick="openInfo(this)" onmousemove="red(this.id)" onmouseout="black(this.id)">' + "时间：" + sensorInfo[j].时间 + "</p>";
                    winfowText += winfowTextAdd;
                    if (j == trackPoints.length - 1) {
                        marker = new BMap.Marker(trackPoints[j], {icon: endIcon, offset: new BMap.Size(0, -20)});
                    }
                }
            }

            if (coincidentPoints.indexOf(i) > -1) {
                winfowText = '<p id="' + i + '" onclick="openInfo(this)" onmousemove="red(this.id)" onmouseout="black(this.id)">' + "时间：" + sensorInfo[i].时间 + "</p>" + winfowText;
                winfowText = '<p id="' + i + '" onclick="openInfo(this)" onmousemove="red(this.id)" onmouseout="black(this.id)">' + "时间：" + sensorInfo[i].时间 + "</p>" + winfowText + "</div>";
            } else {
                for(var prop in sensorInfo[i]){
                for (var prop in sensorInfo[i]) {
                    if (sensorInfo[i].hasOwnProperty(prop)) {
                        winfowText+=(prop+"："+sensorInfo[i][prop]+"</br>");
                        winfowText += (prop + "：" + sensorInfo[i][prop] + "</br>");
                    }
                }
                winfowText += "</div>";
            }

            (function (x) {
                var infoWindow = new BMap.InfoWindow(winfowText, {enableMessage: false});
                marker.addEventListener("click", function () {
@@ -194,10 +194,10 @@

            function openInfo(e) {
                var point = new BMap.Point(sensorInfo[e.id].经度, sensorInfo[e.id].纬度);
                var winfowText1="";
                for(var prop in sensorInfo[e.id]){
                var winfowText1 = "";
                for (var prop in sensorInfo[e.id]) {
                    if (sensorInfo[e.id].hasOwnProperty(prop)) {
                        winfowText1+=(prop+"："+sensorInfo[e.id][prop]+"</br>");
                        winfowText1 += (prop + "：" + sensorInfo[e.id][prop] + "</br>");
                    }
                }
                var infoWindow1 = new BMap.InfoWindow(winfowText1, {enableMessage: false});
@@ -205,19 +205,26 @@
                map.openInfoWindow(infoWindow1, point);
            }

            function red(x)
            {
                document.getElementById(x).style.color="#FF1111";
                document.getElementById(x).style.cursor="pointer";
            function red(x) {
                document.getElementById(x).style.color = "#FF1111";
                document.getElementById(x).style.cursor = "pointer";
            }

            function black(x)
            {
                document.getElementById(x).style.color="#000000";
            function black(x) {
                document.getElementById(x).style.color = "#000000";
            }

            if (count > 0) {
                var lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-7, -23)});
                var lab;
                if(count>0 && count<=8){
                    lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-5, -9)});
                }else if(count>8 && count<=98){
                    lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-10, -9)});
                }else if(count>98 && count<=998){
                    lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-14, -9)});
                }else{
                    lab = new BMap.Label(count + 1, {position: startPoint, offset: new BMap.Size(-18, -9)});
                }
                lab.setStyle({
                    color: "#fff",
                    fontSize: "16px",