土地平整

src/components/TerrainAnalysis/TerrainCutFillAnalysis/TerrainCutFillAnalysisNew.vue

@@ -7,21 +7,39 @@
     element-loading-spinner="el-icon-loading"
     element-loading-background="rgba(0, 0, 0, 0.8)"
   >
-    <el-radio v-model="radio" label="cut">地形填挖方分析</el-radio>
-    <el-radio v-model="radio" label="smooth">地形平整分析</el-radio>
+    <!-- <el-radio v-model="radio" label="cut">地形填挖方分析</el-radio>
+    <el-radio v-model="radio" label="smooth">地形平整分析</el-radio> -->
     <el-form
       :model="cutData"
       ref="ruleForm"
-      label-width="100px"
+      label-width="80px"
       :rules="rules"
       class="ruleForm"
     >
       <el-form-item label="分析范围:" prop="xzmj">
-        <range type="cutfill" :keys="['hx', 'sc']" class="range" ref="range" />
+        <range
+          type="cutfill"
+          :keys="['hx', 'sc']"
+          class="range"
+          ref="range"
+          @cutfill="getDsm"
+        />
       </el-form-item>
-      <el-form-item label="填挖基准:" v-if="radio == 'cut'">
+      <el-form-item label="高程数据:">
+        <span>最小:{{ cutData.min || 0 }}米 </span>
+        <span> 最大:{{ cutData.max || 0 }}米 </span>
+        <span> 平均:{{ cutData.avg || 0 }}米 </span>
+      </el-form-item>
+      <el-form-item label="填挖基准:" v-if="radio == 'cut'" prop="height">
         <!-- readonly="readonly" -->
-        <el-input v-model="smooth_height" placeholder="" size="mini"></el-input>
+        <el-input
+          v-model="form.height"
+          placeholder="不填入基准为平整土地"
+          size="mini"
+        ></el-input>
+      </el-form-item>
+      <el-form-item label="缓冲区:" prop="height">
+        <el-input v-model="form.buffer" placeholder="" size="mini"></el-input>
       </el-form-item>
       <div class="sdatadiv">
         分析结果：
@@ -71,19 +89,23 @@ export default {
   components: { range },
   data() {
     return {
-      radio: "smooth",
+      radio: "cut",
       sharedState: store.state,
       loading: false,
-      smooth_height: "",
+      form: {
+        height: "",
+        buffer: 5,
+        geom: "",
+      },
       cutData: {},
       // 石方量
       sdata: [
-        { name: "填土体积:", prop: "fillVolume", unit: "立方米", value: "" },
-        { name: "开挖体积:", prop: "cutVolume", unit: "立方米", value: "" },
-        { name: "填挖差值:", prop: "cz", unit: "立方米", value: "" },
-        { name: "最大高程:", prop: "maxHeight", unit: "米", value: "" },
-        { name: "最小高程:", prop: "minHeight", unit: "米", value: "" },
-        { name: "填挖基准:", prop: "midHeight", unit: "米", value: "" },
+        { name: "填土体积:", prop: "fillVolume", unit: "立方米" },
+        { name: "开挖体积:", prop: "cutVolume", unit: "立方米" },
+        { name: "填挖差值:", prop: "cz", unit: "立方米" },
+        { name: "最大高程:", prop: "maxHeight", unit: "米" },
+        { name: "最小高程:", prop: "minHeight", unit: "米" },
+        { name: "填挖基准:", prop: "midHeight", unit: "米" },
       ],
       sdh: [
         { scS: "填土", fill: "#1E90A8" },
@@ -103,6 +125,11 @@ export default {
   methods: {
     reset() {
       this.cutData = {};
+      this.form = {
+        height: "",
+        buffer: 5,
+        geom: "",
+      };
       this.$refs.range.reset();
       viewer.entities.removeAll();
       viewer.dataSources.removeAll();
@@ -113,84 +140,59 @@ export default {
         this.$message.warning("请绘制或导入分析范围!");
         return;
       }
-      this.cutFill(_temp.geom);
+      this.form.geom = _temp.geom;
+      this.cutFill();
     },
     clear() {
       common.clearHandlerDrawing("Polygon");
     },
-    async cutFill(geom) {
+
+    async getDsm(geom) {
+      let res = await getDsm({ geom, type: "all" });
+      this.cutData = {
+        min: res.data.min.toFixed(2),
+        max: res.data.max.toFixed(2),
+        avg: res.data.avg.toFixed(2),
+      };
+    },
+    async cutFill() {
       this.loading = true;
-      let res = await cutFill({
-        geom,
-        height: this.smooth_height,
-      });
+      let res = await cutFill(this.form);
+      this.loading = false;
       if (res.success) {
         this.$refs.range.reset();
         if (!res.data) this.$message.error("抱歉！不在分析范围内");
-        this.cutData = res.data;
-
-        Object.keys(this.cutData).forEach((key) => {
-          if (typeof this.cutData[key] == "number")
-            this.cutData[key] = this.cutData[key].toFixed(2);
+        // this.cutData = { ...this.cutData, ...res.data };
+        Object.keys(res.data).forEach((key) => {
+          if (typeof res.data[key] == "number")
+            this.cutData[key] = res.data[key].toFixed(2);
         });
-        this.cutData.cz = res.data.cutVolume - res.data.fillVolume;
+        this.cutData.cz = this.cutData.cutVolume - this.cutData.fillVolume;
 
-        this.loading = false;
-        let pitch = Cesium.Math.toRadians(-45.0);
+        // let pitch = Cesium.Math.toRadians(-45.0);
         let params = { sw: 0.001, fill_a: 0.8 };
-        loadGeoJSON(res.data.bottomGeom, "#1E90A8", params, (data) => {
-          viewer.flyTo(data, {
-            offset: new Cesium.HeadingPitchRange(0, -45, 100),
-          });
-        });
-        loadGeoJSON(res.data.midGeom, "#ff0000", params, (data) => {
-          viewer.flyTo(data, {
-            offset: new Cesium.HeadingPitchRange(0, -45, 100),
-          });
-        });
+        // let fn = (data) => {  data.name = "cut_fill" };
+        viewer.entities.removeAll();
+        viewer.dataSources.removeAll();
+        loadGeoJSON(res.data.bottomGeom, "#1E90A8", params);
+        loadGeoJSON(res.data.midGeom, "#ff0000", params);
       }
-
-      // let newArr = positions.map((item, index) => {
-      //   return (index + 1) % 3 === 0 ? data.data : item;
-      // });
-      // viewer.scene.globe.removeAllModifyRegion();
-      // viewer.scene.globe.addModifyRegion({
-      //   name: "ggg",
-      //   position: newArr,
-      // });
-
-      // this.smooth_height = data.data.toFixed(2);
-      // // let cutVolume = cutFillAnalysis.VolumeAnalysis1(threeArray, Number(height));
-      // // console.log('cutVolume: ', cutVolume);
-
-      // let newArray = [];
-      // for (let i = 0; i < positions_noHeight.length; i += 2) {
-      //   // 将每两个连续的元素组合成一个新的数组，并添加到新数组中
-      //   newArray.push([positions_noHeight[i], positions_noHeight[i + 1]]);
-      // }
-      // newArray.push(newArray[0]);
-
-      // var polygon = turf.polygon([newArray]);
-
-      // this.result_area = turf.area(polygon).toFixed(2);
     },
     ExportResult() {
-      let _this = this;
-      // let box = that.squarePolygon(entitys);
-      // viewer.camera.flyTo({
-      //   destination: Cesium.Rectangle.fromDegrees(
-      //     box[0][0] + 0.0002,
-      //     box[0][1] - 0.0002,
-      //     box[2][0] - 0.0002,
-      //     box[2][1] + 0.0002
-      //   ),
-      // });
-      setTimeout(function () {
-        var promise = scene.outputSceneToFile();
-        Cesium.when(promise, function (base64data) {
-          download(base64data, _this.drawLegends);
-        });
-      }, 1000);
+      var legends = [];
+      // legends.push({ name: "最小高程", value: this.cutData.min, unit: "米" });
+      // legends.push({ name: "最大高程", value: this.cutData.max, unit: "米" });
+      // legends.push({ name: "平均高程", value: this.cutData.avg, unit: "米" });
+      legends.push({ name: "填挖基准", value: this.form.height, unit: "米" });
+      legends.push({ name: "缓冲区", value: this.form.buffer, unit: "米" });
+      this.sdata.forEach((si) =>
+        legends.push({ ...si, value: this.cutData[si.prop] })
+      );
+      legends = [...legends, ...this.sdh];
+      var promise = scene.outputSceneToFile();
+      Cesium.when(promise, (base64data) => {
+        download(base64data, legends);
+      });
     },
     /**
      * 根据图片生成画布
@@ -198,9 +200,6 @@ export default {
 
     // 绘制图例
     drawLegends(canvas, ctx) {
-      let _this = this;
-      console.log("-----");
-      var legends = [...this.sdata, ...this.sdh];
       var padding = 10; // 图例与边缘的间距
       var lineHeight = 30; // 每行图例的高度
       var labW = 200;
@@ -242,7 +241,7 @@ export default {
 <style lang="scss" scoped>
 .cut_fill_box {
   width: 100%;
-  height: 580px;
+  height: 700px;
   padding: 20px;
   box-sizing: border-box;
   position: relative;

src/components/mapView/range.vue

@@ -20,7 +20,7 @@
         <el-button size="mini" @click="clearAll">清除</el-button>
       </div>
     </div>
-    <div>
+    <div v-if="type != 'cutfill'">
       <span v-if="model.xzmj != 0">{{ model.xzmj }} 亩</span>
       <el-tooltip
         v-if="fileList.length > 0"
@@ -118,41 +118,9 @@ export default {
           this.model.xzfw = res.data.id;
           this.model.geom = res.data.geom;
           this.addPolygon(parse(res.data.geom));
-          // let geoms = res.data.geom
-          //   .substring(
-          //     res.data.geom.indexOf("(((") + 3,
-          //     res.data.geom.length - 3
-          //   )
-          //   .split(")),((");
-          // for (let i = 0; i < geoms.length; i++) {
-          //   let geom = geoms[i].split(",");
-          //   let points = [];
-          //   for (let j = 0; j < geom.length; j++) {
-          //     points.push(parseFloat(geom[j].split(" ")[0]));
-          //     points.push(parseFloat(geom[j].split(" ")[1]));
-          //   }
-          //   points.push(parseFloat(geom[0].split(" ")[0]));
-          //   points.push(parseFloat(geom[0].split(" ")[1]));
-          //   viewer.entities.add({
-          //     // polyline: new Cesium.PolylineGraphics({
-          //     //   positions: Cesium.Cartesian3.fromDegreesArray(points),
-          //     //   width: 3,
-          //     //   material: Cesium.Color.BLUE.withAlpha(0.9),
-          //     //   clampToGround: true,
-          //     // }),
-          //     polygon: {
-          //       hierarchy: {
-          //         positions: Cesium.Cartesian3.fromDegreesArray(points),
-          //       },
-          //       material: Cesium.Color.WHITE.withAlpha(0.3),
-          //       clampToGround: true,
-          //       outline: true,
-          //       outlineWidth: 5,
-          //       outlineColor: Cesium.Color.RED,
-          //     },
-          //   });
-          // }
-          // viewer.flyTo(viewer.entities);
+          if (this.$props.type == "cutfill") {
+            this.$emit("cutfill", this.model.geom);
+          }
         }
       });
     },
@@ -267,6 +235,11 @@ export default {
           // var parse = require("wellknown"); //引入wellknow
           const wktPolygon = parse.stringify(geojsonPolygon);
           // console.log("WKT Polygon:", wktPolygon);
+          if (this.$props.type == "cutfill") {
+            this.model.geom = wktPolygon;
+            this.$emit("cutfill", this.model.geom);
+            return;
+          }
 
           const formdata = new FormData();
           // formdata.append("file", file.raw);