提交

ansel0926

2022-05-14 337c94f6e0a0759b9f627db4cdd4cb88dc65d896

 assets/map/map3D.js

@@ -113,6 +113,8 @@
   //添加海洋流动效果
   // addSeaFlow();

   //初始化绘制图形
   initDrawEntity();
}

var mouseMoveHandler
@@ -146,6 +148,9 @@
         viewer.clock.onTick.removeEventListener(onTickCallback);
         var pick = viewer.scene.pick(movement.position);
         CesiumPop.removeDiv();
         if(labelLayer!=null){//关闭文字编辑弹窗
            layer.close(labelLayer);
         }
         if (pick != undefined && pick instanceof Cesium.Cesium3DTileFeature) {
            var propertyNames = pick.getPropertyNames();
            var length = propertyNames.length;
@@ -198,12 +203,14 @@
         else if (pick != undefined && pick instanceof Object) {
            var pickPrimitive = pick.primitive;
            var entity = pick.id;
            var cartesian = viewer.scene.pickPosition(movement.position);
            //添加文字标签事件：zzf
            if(entity!=undefined && entity instanceof Object &&entity.title!=undefined){
               if(entity._name=='drawLabelEtity'){
                  if(labelLayer!=null){
                     layer.close(labelLayer);
                  }
                  layer.config({
                     extend: 'myskin/style.css' //同样需要先加载新皮肤
                  });
						
                  labelLayer=layer.open({
                     type: 2,
                     title: '<i class="iconfont icon-huitu i-item" style="font-size: 18px; color: white;"></i>  ' + "编辑文字",
@@ -224,12 +231,12 @@
                  });
               }
            }
            var cartesian = viewer.scene.pickPosition(movement.position);
            var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
            var lat = Cesium.Math.toDegrees(cartographic.latitude);
            var lng = Cesium.Math.toDegrees(cartographic.longitude);
            var alt1 = cartographic.height;
            if (pickPrimitive instanceof Cesium.PointPrimitive || pickPrimitive instanceof Cesium.GroundPolylinePrimitive || pickPrimitive instanceof Cesium.GroundPrimitive) {
            // var cartesian = viewer.scene.pickPosition(movement.position);
            // var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
            // var lat = Cesium.Math.toDegrees(cartographic.latitude);
            // var lng = Cesium.Math.toDegrees(cartographic.longitude);
            // var alt1 = cartographic.height;
            // if (pickPrimitive instanceof Cesium.PointPrimitive || pickPrimitive instanceof Cesium.GroundPolylinePrimitive || pickPrimitive instanceof Cesium.GroundPrimitive) {
               // CesiumPop.bindPopGlobeEventHandler(viewer);
               // var content = '<div class="mapPop font2">'
               //    + '<div style="margin-top:10px;margin-left:15px;">'
@@ -255,7 +262,7 @@
               //    "primitive": pick.primitive
               // }
               // CesiumPop.addDivPop(options);
            }
            // }
         }
      

@@ -757,7 +764,43 @@
      let font=signPointEntity._label._font._value.split(" ");
      signPointEntity._label._font._value = font[0]+" "+val;
   }

   // let mydata = "{id:'" + signPointEntity._id + "',";
   // mydata = mydata + "type:label,";
   // mydata = mydata + "longitude:" + signPointEntity._position._value.x + ",";
   // mydata = mydata + "latitude:" + signPointEntity._position._value.y + ",";
   // mydata = mydata + "height:" + signPointEntity._position._value.z + ",";
   // mydata = mydata + "content:" + signPointEntity.title + ",";
   // mydata = mydata + "color:'" + signPointEntity._label._fillColor._value.toCssColorString() + "',";
   // mydata = mydata + "fontsize:'" + signPointEntity._label._font._value[0].replace("px","") + "',";
   // mydata = mydata + "fontstyle:'" + signPointEntity._label._font._value[1] + "'}";
   let saveData= {
      "id":signPointEntity._id,
      "type": "label",
      "longitude": signPointEntity._position._value.x,
      "latitude": signPointEntity._position._value.y,
      "height": signPointEntity._position._value.z,
      "content":signPointEntity.title,
      "color":signPointEntity._label._fillColor._value.toCssColorString(),
      "fontsize":signPointEntity._label._font._value.split(" ")[0].replace("px",""),
      "fontstyle":signPointEntity._label._font._value.split(" ")[1],
   }
   let token = window.localStorage.getItem("token");
   $.ajax({
      type: "post",
      async: false,
        url: parent.httpConfig.webApiUrl + "landstamp/front/updateDrawEntity",
        data: saveData,
      contentType: "application/x-www-form-urlencoded",
        beforeSend:function(request){
            request.setRequestHeader("token",token);
        },
      success: function (data) {
         console.log(data)
      },
      error: function (XMLHttpRequest, textStatus, errorThrown) {
         console.log("ajax请求失败！");
      }
   });
}

function addSeaFlow() {
@@ -1088,4 +1131,186 @@
      })
   });
   viewer.scene.primitives.add(waterPrimitive);*/
}

function initDrawEntity(){//zzf:初始化图形
   let token = window.localStorage.getItem("token");
    $.ajax({
      type: "get",
      async: false,
        url: parent.httpConfig.webApiUrl + "landstamp/front/getDrawEntity",
      contentType: "application/json;charset=utf-8",
        beforeSend:function(request){
            request.setRequestHeader("token",token);
        },
      success: function (data) {
         if(data.rows!=null){
            for(let i=0;i<data.rows.length;i++){
               if(data.rows[i].type=="point"){
                  drawAjaxPoint(data.rows[i])
               }
               else if(data.rows[i].type=="polyline"){
                  drawAjaxPolyline(data.rows[i])
               }
               else if(data.rows[i].type=="polygon"){
                  drawAjaxPolygon(data.rows[i])
               }
               else if(data.rows[i].type=="label"){
                  drawAjaxLabel(data.rows[i])
               }
            }
         }
      },
      error: function (XMLHttpRequest, textStatus, errorThrown) {
         console.log("ajax请求失败！");
      }
   });
}

function drawAjaxPoint(drawEntity){//加载点
   let cartesian=new Cesium.Cartesian3(parseFloat(drawEntity.longitude),parseFloat(drawEntity.latitude),parseFloat(drawEntity.height))
   var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
   var entity = viewer.entities.add({
      id:drawEntity.id,
      name: 'drawPointEntity',
      position: cartesian,
      point: {
         color: Cesium.Color.RED,
         pixelSize: 10,
         outlineColor: Cesium.Color.WHITE,
         outlineWidth: 2,
         disableDepthTestDistance: Number.POSITIVE_INFINITY
      }
   });
   entity.title =  "点" + new Date(drawEntity.createTime).format("yyyyMMddhhmmss");
   addTreeNode({
      "title": entity.title,
      "id": entity.id,
      "field": "Entity",
      "checked": true,
      "spread": true,
      "children": [],
      "ext": {
         "lng": Cesium.Math.toDegrees(cartographic.longitude),
         "lat": Cesium.Math.toDegrees(cartographic.latitude)
      }
   }, "4");
}

function drawAjaxPolyline(drawEntity){//加载线
   var measureLinePositonsArray = [];//存储已量测的线段的折点
   let longitudeList=drawEntity.longitude.split(",");
   let latitudeList=drawEntity.latitude.split(",");
   let heightList=drawEntity.height.split(",");
   //点坐标
   for(let i=0;i<longitudeList.length;i++){
      let cartesian=new Cesium.Cartesian3(parseFloat(longitudeList[i]),parseFloat(latitudeList[i]),parseFloat(heightList[i]))
      measureLinePositonsArray.push(cartesian);
   }
   var drawpointArr = []; 
   var measureLineGroundEntity = viewer.entities.add({
      id:drawEntity.id,
      name: 'measureLineGroundEntity',
      polyline: {
         clampToGround: true,
         width: 1,
         material: new Cesium.Color.fromBytes(255,124,0,255),
         positions:measureLinePositonsArray
      },
      drawpointArr: drawpointArr,
      measureLinePositonsArray: measureLinePositonsArray
   });
   measureLineGroundEntity.title = "折线" + new Date(drawEntity.createTime).format("yyyyMMddhhmmss");
   addTreeNode({
      "title": measureLineGroundEntity.title,
      "id": measureLineGroundEntity.id,
      "field": "Entity",
      "checked": true,
      "spread": true,
      "children": [],
      "ext": {
         // "lng": Cesium.Math.toDegrees(cartographic.longitude),
         // "lat": Cesium.Math.toDegrees(cartographic.latitude)
      }
   }, "4");
}

function drawAjaxPolygon(drawEntity){//加载面
   var polyPositions = [];//存储多边形的点
   let longitudeList=drawEntity.longitude.split(",");
   let latitudeList=drawEntity.latitude.split(",");
   let heightList=drawEntity.height.split(",");
   //点坐标
   for(let i=0;i<longitudeList.length;i++){
      let cartesian=new Cesium.Cartesian3(parseFloat(longitudeList[i]),parseFloat(latitudeList[i]),parseFloat(heightList[i]))
      polyPositions.push(cartesian);
   }
   var polygon = new Cesium.PolygonHierarchy();
   polygon.positions=polyPositions;
   var polyCenter = Cesium.BoundingSphere.fromPoints(polyPositions).center;
   polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter);
   let cartographic = Cesium.Cartographic.fromCartesian(polyCenter, viewer.scene.globe.ellipsoid, new Cesium.Cartographic());
   var measurePolyGonGroundEntity = viewer.entities.add({
      id:drawEntity.id,
      name: 'measurePolyGonGroundEntity',
      polygon: {
         material: new Cesium.ColorMaterialProperty(Cesium.Color.RED.withAlpha(0.3)),
         classificationType: Cesium.ClassificationType.BOTH,
         outline: true,
         outlineColor: Cesium.Color.WHITE,
         hierarchy: new Cesium.CallbackProperty(function () {
            return polygon;
         }, false)
      }
   });
   measurePolyGonGroundEntity.title = "面" +  new Date(drawEntity.createTime).format("yyyyMMddhhmmss");
   addTreeNode({
      "title": measurePolyGonGroundEntity.title,
      "id": measurePolyGonGroundEntity.id,
      "field": "Entity",
      "checked": true,
      "spread": true,
      "children": [],
      "ext": {
         "lng": Cesium.Math.toDegrees(cartographic.longitude),
         "lat": Cesium.Math.toDegrees(cartographic.latitude)
      }
   }, "4");
}

function drawAjaxLabel(drawEntity){//加载文字
   let cartesian=new Cesium.Cartesian3(parseFloat(drawEntity.longitude),parseFloat(drawEntity.latitude),parseFloat(drawEntity.height))
   var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
   cartographic = Cesium.Cartographic.fromCartesian(cartesian);
   var entity = viewer.entities.add({
      id:drawEntity.id,
      name: 'drawLabelEtity',
      position: cartesian.clone(),
      label: {
         text: drawEntity.content,
         font: drawEntity.fontsize+'px '+drawEntity.fontstyle,
         fillColor: Cesium.Color.fromCssColorString(drawEntity.color),
         outlineColor: Cesium.Color.BLACK,
         outlineWidth: 2,
         style: Cesium.LabelStyle.FILL_AND_OUTLINE,
         verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
         horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
         disableDepthTestDistance: Number.POSITIVE_INFINITY,
         heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
         distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 10000000000000.0)
      }
   });
   entity.title=drawEntity.content,
   addTreeNode({
      "title": entity.title,
      "id": entity.id,
      "field": "Entity",
      "checked": true,
      "spread": true,
      "children": [],
      "ext": {
         "lng": Cesium.Math.toDegrees(cartographic.longitude),
         "lat": Cesium.Math.toDegrees(cartographic.latitude)
      }
   }, "4");
}