模型实体拉伸修改

src/views/modelStretch/index.vue

@@ -88,19 +88,19 @@ export default {
   },
   data() {
     return {
-      form: { BuildingHeight: 50, FLOORH: 5 },
+      form: { BuildingHeight: 50, FLOORH: 5, xzmj: 0 },
       rules: {
         xzmj: [{ required: true, message: "请填写范围的数据" }],
         BuildingHeight: [{ required: true, message: "请填写模型高度" }],
         FLOORH: [{ required: true, message: "请填写层高" }],
         mxmc: [
-          { required: true, message: "请输入模型名称", trigger: "blur" },
-          {
-            min: 3,
-            max: 50,
-            message: "长度在 3 到 50 个字符",
-            trigger: "blur",
-          },
+          // { required: true, message: "请输入模型名称", trigger: "blur" },
+          // {
+          //   min: 3,
+          //   max: 50,
+          //   message: "长度在 3 到 50 个字符",
+          //   trigger: "blur",
+          // },
         ],
       },
     };
@@ -147,7 +147,7 @@ export default {
       }
     },
     // 加载GeoJSON数据
-    loadGeoJSON(geojson, yanse, id, height, name) {
+    loadGeoJSON(geojson, yanse, id, height, eheight, name) {
       let _this = this;
       let fcolor =
         id && id != "all"
@@ -159,14 +159,14 @@ export default {
           clampToGround: true,
           stroke: Cesium.Color.fromCssColorString(yanse),
           fill: fcolor.withAlpha(0.4), //注意：颜色必须大写，即不能为blue
-          strokeWidth: 5,
+          strokeWidth: 2,
           // markerSymbol: "", //点图钉的默认符号
         })
         .then((data) => {
           viewer.dataSources.add(data);
           let entities = data.entities.values;
           // let addlabel = false;
-          if (!geojson.type.includes("Polygon") || height) {
+          if (!geojson.type.includes("Polygon") || eheight) {
             entities.forEach((entity, ei) => {
               if (entity.billboard) {
                 entity.billboard = undefined;
@@ -175,36 +175,43 @@ export default {
                   color: Cesium.Color.fromCssColorString(yanse),
                 };
               }
-              if (height && entity.polygon) {
-                entity.polygon.extrudedHeight = height;
-                entity.polygon.material =
-                  Cesium.Color.fromCssColorString("#cdcdcd");
-                entity.polygon.outlineColor = Cesium.Color.BLACK;
-                entity.polygon.outlineWidth = 1.0;
+              if (eheight && entity.polygon) {
+                if (height == 0) console.log(entity.polygon, "eee");
+                entity.polygon.height = height;
+                entity.polygon.extrudedHeight = eheight || height;
+                entity.polygon.material = new Cesium.Color(
+                  0.7,
+                  0.7,
+                  0.7,
+                  1.0
+                ).withAlpha(1);
+                // entity.polygon.outlineColor = Cesium.Color.WHITE;
+                // entity.polygon.outlineWidth = 2;
                 // if (!addlabel) {
-                let center = getCentroid(geojson, ei);
-
-                var polycenter = Cesium.Cartesian3.fromDegrees(
-                  center[0],
-                  center[1],
-                  height
-                );
-                entity.position = polycenter;
-                entity.label = {
-                  font: "bolder 18px sans-serif",
-                  style: Cesium.LabelStyle.FILL_AND_OUTLINE,
-                  text: name, //图标名称
-                  fillColor: Cesium.Color.fromCssColorString("#fff000"),
-                  pixelOffset: new Cesium.Cartesian2(0, -20),
-                  zIndex: 3,
-                };
+                if (name) {
+                  let center = getCentroid(geojson, ei);
+                  var polycenter = Cesium.Cartesian3.fromDegrees(
+                    center[0],
+                    center[1],
+                    height
+                  );
+                  entity.position = polycenter;
+                  entity.label = {
+                    font: "bolder 18px sans-serif",
+                    style: Cesium.LabelStyle.FILL_AND_OUTLINE,
+                    text: name, //图标名称
+                    fillColor: Cesium.Color.fromCssColorString("#fff000"),
+                    pixelOffset: new Cesium.Cartesian2(0, -20),
+                    zIndex: 3,
+                  };
+                }
                 // addlabel = true;
                 // }
               }
             });
           }
-          var pitch = height ? -0.8 : -45; // Cesium.Math.toRadians(-45.0);-0.7853981633974483
-          let range = height ? 3000 : 5000;
+          var pitch = height ? Cesium.Math.toRadians(-15.0) : -45; // Cesium.Math.toRadians(-45.0);-0.7853981633974483
+          let range = height ? 1000 : 5000;
           viewer.flyTo(data, {
             offset: new Cesium.HeadingPitchRange(0, pitch),
           });
@@ -239,15 +246,25 @@ export default {
     getjcHigeht(geojson) {
       // sampleTerrainMostDetailed
       let gcHight = 0;
-      let center = getCentroid(geojson, 0);
-      console.log(center, "-center");
-      var polycenter = [Cesium.Cartographic.fromDegrees(center[0], center[1])];
-      Cesium.sampleTerrain(viewer.terrainProvider, 11, polycenter).then(
-        (updatedPositions) => {
-          gcHight = updatedPositions[0].height;
+      if (viewer.terrainProvide) {
+        let center = getCentroid(geojson, 0);
+        var polycenter = [
+          Cesium.Cartographic.fromDegrees(center[0], center[1]),
+        ];
+        let allPoints = [];
+        for (let p = 0; p < polygon.length; p += 2) {
+          allPoints.push(
+            Cesium.Cartographic.fromDegrees(polygon[p], polygon[p + 1])
+          );
         }
-      );
-      console.log("---", gcHight);
+        Cesium.sampleTerrain(viewer.terrainProvider, 11, polycenter).then(
+          (updatedPositions) => {
+            gcHight = updatedPositions[0].height;
+          }
+        );
+        console.log("---", gcHight);
+      }
+
       return gcHight;
     },
     onSubmit(geojson) {
@@ -267,7 +284,9 @@ export default {
         // debugger;
         maxH += that.form.FLOORH;
         minH = maxH - that.form.FLOORH;
+        if (maxH > that.form.BuildingHeight) maxH = that.form.BuildingHeight;
         console.log("maxH:" + maxH + "----minH:" + minH);
+        this.loadGeoJSON(this.form.geojson, "#ffffff", "", minH, maxH, "");
         let ps = [];
         // for (let index = 0; index < element.geometry.points.length; index++) {
         //   const point = element.geometry.points[index];
@@ -275,26 +294,26 @@ export default {
         //   ps.push(point.y);
         //   // ps.push(minH);
         // }
-        geojson.coordinates[0].forEach((gom) => {
-          ps.push(gom[0]);
-          ps.push(gom[1]);
-        });
-        // let id = uuidv4();
-        this.addPolygon(ps, jcgd, that.form.BuildingHeight);
+        // geojson.coordinates[0].forEach((gom) => {
+        //   ps.push(gom[0]);
+        //   ps.push(gom[1]);
+        // });
+        // // let id = uuidv4();
+        // this.addPolygon(ps, jcgd, that.form.BuildingHeight);
 
-        let pss = [];
-        // for (let index = 0; index < element.geometry.points.length; index++) {
-        //   const point = element.geometry.points[index];
-        //   pss.push(point.x);
-        //   pss.push(point.y);
+        // let pss = [];
+        // // for (let index = 0; index < element.geometry.points.length; index++) {
+        // //   const point = element.geometry.points[index];
+        // //   pss.push(point.x);
+        // //   pss.push(point.y);
+        // //   pss.push(maxH);
+        // // }
+        // geojson.coordinates[0].forEach((gom) => {
+        //   pss.push(gom[0]);
+        //   pss.push(gom[1]);
         //   pss.push(maxH);
-        // }
-        geojson.coordinates[0].forEach((gom) => {
-          pss.push(gom[0]);
-          pss.push(gom[1]);
-          pss.push(maxH);
-        });
-        this.addPolyline(pss);
+        // });
+        // this.addPolyline(pss);
 
         // viewer.entities.add({
         //   id: id,