Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

src/components/3DAnalysis/ClippingPlanes/index.vue

@@ -1,33 +1,97 @@
 <template>
   <div class="sm-function-module-content">
-    <label class="sm-function-module-sub-section-setting"> 分析结果 </label>
     <el-form :model="form" ref="ruleForm" label-width="100px">
-      <el-form-item label="剖面范围:" prop="xzmj">
-        <range type="clip" :keys="['hx']" class="range" ref="range" />
+      <el-form-item label="裁剪区域宽度:" prop="width">
+        <el-slider
+          class="inputwidth"
+          :min="1"
+          :max="500"
+          :step="1"
+          v-model="form.width"
+          @input="changewh()"
+        ></el-slider>
+      </el-form-item>
+      <el-form-item label="裁剪区域高度:" prop="height">
+        <el-slider
+          class="inputwidth"
+          :min="1"
+          :max="500"
+          :step="1"
+          v-model="form.height"
+          @input="changewh()"
+        ></el-slider>
+      </el-form-item>
+      <el-form-item label="绕X轴旋转:" prop="pitch">
+        <el-slider
+          class="inputwidth"
+          :min="0"
+          :max="360"
+          :step="1"
+          v-model="form.pitch"
+          @input="changehpr()"
+        ></el-slider>
+      </el-form-item>
+      <el-form-item label="绕Y轴旋转:" prop="roll">
+        <el-slider
+          class="inputwidth"
+          :min="0"
+          :max="360"
+          :step="1"
+          v-model="form.roll"
+          @input="changehpr()"
+        ></el-slider>
+      </el-form-item>
+      <el-form-item label="绕Z轴旋转:" prop="heading">
+        <el-slider
+          class="inputwidth"
+          :min="0"
+          :max="360"
+          :step="1"
+          v-model="form.heading"
+          @input="changehpr()"
+        ></el-slider>
+      </el-form-item>
+      <el-form-item label="拉伸高度:" prop="extrudeDistance">
+        <el-slider
+          class="inputwidth"
+          :min="0.01"
+          :max="100"
+          :step="0.02"
+          v-model="form.extrudeDistance"
+          @input="analysis"
+        ></el-slider>
       </el-form-item>
-      <!-- <el-form-item label="模型名称:" prop="mxmc">
-        <el-input
-          v-model="form.mxmc"
-          size="mini"
-          placeholder="请输入模型名称"
-        ></el-input>
-      </el-form-item> -->
     </el-form>
     <div class="boxchild">
-      <el-button type="primary" size="mini" @click="analysis">分析</el-button>
+      <el-button type="primary" size="mini" @click="clickPoint"
+        >点击选择点位</el-button
+      >
       <el-button type="primary" size="mini" @click="clear">清除</el-button>
     </div>
   </div>
 </template>
 
 <script>
+import { moveHandler, pickPoint } from "@/utils/MapHelper/help.js";
+let pos = {};
+let box = null;
+let startClip = false;
+let boxPosition = {};
+let layers = null;
 export default {
   name: "ClippingPlanes",
   props: {},
   data() {
     return {
       form: {
-        geom: "",
+        width: 100,
+        height: 100,
+        heading: 0,
+        pitch: 0,
+        roll: 0,
+        // 裁剪区域中心点拉伸距离，单位:米，
+        extrudeDistance: 0.01,
+        isMoving: false,
       },
     };
   },
@@ -35,20 +99,122 @@ export default {
 
   beforeDestroy() {},
   mounted() {
-    // this.init();
+    layers = store.state.tempLatData[0][0];
+    viewer.flyTo(layers);
+    this.addEntity();
   },
 
   methods: {
+    clickPoint() {
+      // startClip = true;
+      if (!box) this.addEntity();
+      box.show = true;
+      moveHandler((position) => {
+        boxPosition = position;
+        this.setBox();
+      });
+      pickPoint(false, (position, handler) => {
+        pos = position;
+        // this.form.extrudeDistance = 100 - hei;
+        // this.changehpr(pos);
+        box.show = false;
+        this.analysis();
+        handler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+      });
+    },
+    changewh() {
+      this.setBox();
+      this.analysis();
+    },
+    changehpr(pos) {
+      if (!box) return;
+      var hpr = new Cesium.HeadingPitchRoll(
+        Cesium.Math.toRadians(this.form.heading),
+        Cesium.Math.toRadians(this.form.pitch),
+        Cesium.Math.toRadians(this.form.roll)
+      );
+
+      box.orientation = Cesium.Transforms.headingPitchRollQuaternion(
+        pos || boxPosition,
+        hpr
+      );
+      this.analysis();
+    },
+
     analysis() {
-      // viewer.flyTo(this.sceneLayers[obj.title][0][0]);
+      if (!pos.x) return;
+      // this.vectorlayerlist.push(obj);
       // store.state.sceneLayerlist[obj.title];
       // this.layerparams.forEach(laitem => {
-      //   BIMLayer.setCustomClipPlane(positions[0],positions[1],positions[2]);
-      // });
+      // this.addEntity();
+      this.updateClip();
+    },
+    // addEntity() {
+    //   viewer.entities.removeAll();
+    //   let js = 0.0000095;
+    //   // 计算矩形的边界坐标;
+    //   var minX = pos.lon - (this.form.width / 2) * js;
+    //   var maxX = pos.lon + (this.form.width / 2) * js;
+    //   var minY = pos.lat - (this.form.height / 2) * js;
+    //   var maxY = pos.lat + (this.form.height / 2) * js;
+    //   // 创建一个长方形实体
+    //   viewer.entities.add({
+    //     rectangle: {
+    //       coordinates: Cesium.Rectangle.fromDegrees(minX, minY, maxX, maxY),
+    //       material: new Cesium.Color.BLUE.withAlpha(0.5),
+    //       outline: true,
+    //       outlineColor: Cesium.Color.BLACK,
+    //       height: this.form.extrudeDistance,
+    //     },
+    //   });
+    // },
+    addEntity() {
+      box = viewer.entities.add({
+        // 标识盒
+        position: Cesium.Cartesian3.fromDegrees(0, 0, 0),
+        show: false,
+        box: {
+          dimensions: new Cesium.Cartesian3(5, 5, 0.1),
+          fill: false,
+          outline: true,
+          outlineColor: Cesium.Color.RED,
+          outlineWidth: 5.0,
+        },
+      });
+      this.setBox();
+      this.changehpr();
+    },
+    setBox() {
+      if (!box) return;
+      box.box.dimensions = new Cesium.Cartesian3(
+        this.form.width,
+        this.form.height,
+        0.1
+      );
+      box.position = boxPosition;
+    },
+
+    updateClip() {
+      console.log(layers, "llll");
+      // layers.setCustomClipPlane(pos[0], pos[1], pos[2]);
+      layers.setCustomClipCross({
+        position: pos,
+        dimensions: new Cesium.Cartesian3(
+          this.form.width,
+          this.form.height,
+          this.form.extrudeDistance
+        ),
+        heading: this.form.heading,
+        pitch: this.form.pitch,
+        roll: this.form.roll,
+        extrudeDistance: this.form.extrudeDistance,
+      });
     },
-    getBuffer() {},
     clear() {
-      // BIMLayer.clearCustomClipBox();
+      if (box) box.show = false;
+      // layers.clearCustomClipBox();
+      layers.clearCustomClipBox();
+      // viewer.entities.removeAll();
     },
   },
   watch: {},
@@ -56,4 +222,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.inputwidth {
+  width: calc(100% - 10px);
+}
 </style>

src/components/echartsTemplate/pie.vue

@@ -195,7 +195,7 @@ export default {
       if (cartData.type == "vertical") {
         option.series[0].radius = ["27%", "42%"];
         option.series[0].center = ["50%", "100"];
-        // option.legend.height = "40%";
+        option.legend.height = cartData.data.length * 10;
         option.legend.top = "200";
         option.legend.orient = "vertical";
         option.legend.left = "2%";

src/utils/MapHelper/help.js

@@ -85,9 +85,58 @@ export function loadGeoJSON(geom, yanse, adata, fun) {
   //   }
   // });
 }
-/**
-    * 下载图片
-    */
+export function addPonit() {
+  // manager_multi_level_query.entities.add({
+  //   name: "manager_multi_level_query",
+  //   position: Cesium.Cartesian3.fromDegrees(longitude, latitude, 40),
+  //   billboard: {
+  //     // 图像地址，URI或Canvas的属性
+  //     image: "./static/images/overview/go.png",
+  //     height: 34,
+  //     width: 36,
+  //     scale: 1.0,
+  //     zIndex: 2,
+  //     show: true,
+  //   },
+  // });
+}
+export function clearPoint() {
+  // 图标
+  // var entities = manager_multi_level_query.entities.values;
+  // for (var i = entities.length - 1; i >= 0; i--) {
+  //   manager_multi_level_query.entities.remove(entities[i]);
+  // }
+}
+export function moveHandler(fun) {
+  let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
+  handler.setInputAction((event) => {
+    var position = viewer.scene.pickPosition(event.endPosition);
+    if (!position) return;
+    fun(position)
+  }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+}
+export function pickPoint(isjs, fun) {
+  let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
+  handler.setInputAction((event) => {
+    var position = viewer.scene.pickPosition(event.position);
+    if (!position)
+      //点击到地球之外
+      return false;
+    if (isjs) {
+      var cartographic = Cesium.Cartographic.fromCartesian(position);
+      let lon = Cesium.Math.toDegrees(cartographic.longitude);
+      let lat = Cesium.Math.toDegrees(cartographic.latitude);
+      let height = cartographic.height;
+      // let heading = viewer.scene.camera.heading;
+      // let pitch = viewer.scene.camera.pitch;
+      fun(lon, lat, height)
+    }
+    else fun(position, handler)
+    handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
+  }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
+}
+
+// 导出结果下载图片
 export function download(base64data, fu) {
   var image = new Image();
   image.src = base64data;
@@ -101,9 +150,7 @@ export function download(base64data, fu) {
     a.dispatchEvent(event); // 触发超链接的点击事件
   };
 }
-/**
-     * 根据图片生成画布
-     */
+// 根据图片生成画布
 function convertImageToCanvas(image, fu) {
   var canvas = document.createElement("canvas");
   canvas.width = image.width;
@@ -152,7 +199,7 @@ function drawLegends(canvas, ctx, legends) {
 }
 
 /**
-*计算用户坐标应该减去的差值
+*wms数据查询计算用户坐标应该减去的差值
 */
 function getZoomBbox(zoom) {
   let level0 = 142.03125

src/views/farmlandProtection/components/fxjg.vue

@@ -48,7 +48,7 @@
       <div class="echartCon">
         <pie
           class="echart"
-          :style="`height: ${200 + edata.length * 15}px`"
+          :style="`height: ${200 + edata.length * 10}px`"
           unit="㎡"
           @echartClick="(name) => echartClick(name)"
           :ref="`echartRef`"