客户端渲染

yanzhu-bigscreen/public/index.html

@@ -27,7 +27,7 @@
     <link rel="stylesheet" href="/cdn/Cesium/Widgets/widgets.css" />
     <!-- <script src="/cesium/jquery-3.0.0.min.js"></script> -->
     <script src="/cdn/Cesium/Cesium.js?v=20250729"></script>
-    <script src="/cdn/Cesium/BIMGISEngine.js?v=20250729"></script>
+    <script src="/cdn/Cesium/BIMGISEngine.js?v=20250820"></script>
     <script src="/cdn/Cesium/initApi.js?v=20230920"></script>
 
     <!--<script src="/cdn/map/initApi.js"></script>      -->

yanzhu-bigscreen/src/views/bim/briefingTools.js

@@ -46,9 +46,37 @@ function dataFiltering(that, id) {
   });
 }
 /**
- * 获取构件属性信息
+ * 获取构件属性信息-客户端渲染
+ */
+function getClientProperty(that) {
+  let api = bimBriefingApi;
+  api.Public.event("LEFT_CLICK", e => {
+    api.Feature.getByEvent(e.position, n => {
+      if (n && n["id"]) {
+        let featureId = n.id;
+        if (featureId.split("^")[1]) {
+          clearSelectFeature(that);
+          api.Feature.setColor(featureId, 255, 0, 255, 1);
+          that.selFeatureId = featureId;
+          dataFiltering(that, featureId);
+          that.propertyLoad = "start";
+          that.attributeInformation = "查询中，请稍候~";
+        }
+      } else {
+        that.attributeInformation = "未选中构件";
+      }
+    }, false, false)
+  });
+}
+/**
+ * 获取构件属性信息-服务端渲染
  */
 function getProperty(that) {
+  that.$message.info("请在模型中点击选中构件");
+  if (that.isClient) {
+    getClientProperty(that);
+    return;
+  }
   let api = bimBriefingApi;
   api.Feature.getByEvent(true, (n) => {
     if (n && n["id"]) {
@@ -74,18 +102,67 @@ function getModelUnit(that, modelId) {
 }
 
 /**
- * 获取构件尺寸信息
+ * 获取构件尺寸信息-客户端渲染
  */
-function subFeatureSize(that) {
+function subFeatureSizeClient(that) {
   let api = bimBriefingApi;
   let result = [
     { name: "构建尺寸", data: [] },
     { name: "构建表面积", data: [] },
     { name: "构建体积", data: [] },
   ];
+  api.Public.event("LEFT_CLICK", e => {
+    api.Feature.getByEvent(e.position, n => {
+      if (n && n["id"]) {
+        let featureId = n.id;
+        if (featureId.split("^")[1]) {
+          let modelId = featureId.split("^")[0];
+
+          clearSelectFeature(that);
+          api.Feature.setColor(featureId, 255, 0, 255, 1);
+          that.selFeatureId = featureId;
+          api.Feature.getGeometrySizeById(featureId, modelId, res => {
+            if (res) {
+              let unit = getModelUnit(that, modelId);
+              let size = res || {};
+              let x = (size.x || 0) * unit * 1.0;
+              let y = (size.y || 0) * unit * 1.0;
+              let z = (size.z || 0) * unit * 1.0;
+              result[0].data = [
+                { name: "长", value: x.toFixed(2) + "" },
+                { name: "宽", value: y.toFixed(2) + "" },
+                { name: "高", value: z.toFixed(2) + "" },
+              ];
+              result[1].data = [{ name: "面积", value: (x * y).toFixed(4) + "" }];
+              result[2].data = [{ name: "体积", value: (x * y * z).toFixed(6) }];
+            }
+          });
+        }
+      }
+    });
+  });
+  that.info = result;
+}
+
+/**
+ * 获取构件尺寸信息-服务端渲染
+ */
+function subFeatureSize(that) {
+  let api = bimBriefingApi;
   that.info = [];
   api.Public.clearHandler();
   api.Measurement.clearAllTrace();
+  if (that.isClient) {
+    subFeatureSizeClient(that);
+    return;
+  }
+
+  let result = [
+    { name: "构建尺寸", data: [] },
+    { name: "构建表面积", data: [] },
+    { name: "构建体积", data: [] },
+  ];
+
   api.Feature.getByEvent(true, (n) => {
     if (n && n["id"]) {
       let featureId = n.id;
@@ -115,7 +192,8 @@ function subFeatureSize(that) {
 function measurementArea(that) {
   let api = bimBriefingApi;
   that.info = [];
-  api.Public.clearHandler(), api.Measurement.clearAllTrace();
+  api.Public.clearHandler();
+  api.Measurement.clearAllTrace();
   api.Feature.getByEvent(true, (n) => {
     console.log(n);
     if (n && n["id"]) {
@@ -133,13 +211,55 @@ function measurementArea(that) {
 
 //构件体积
 function measuringVolume(that) { }
-//构件距离
+//构件距离--客户端渲染
+function distanceClient(that) {
+  let api = bimBriefingApi;
+  let result = [{ name: "测量结果", data: [] }];
+  let unit = 1;
+  api.Public.event("LEFT_CLICK", e => {
+    api.Feature.getByEvent(e.position, n => {
+      if (n && n["id"]) {
+        let featureId = n.id;
+        if (featureId.split("^")[1]) {
+          let modelId = featureId.split("^")[0];
+          unit = getModelUnit(that, modelId);
+        }
+      }
+    });
+  });
+  api.Measurement.distance(data => {
+    if (data) {
+      result[0].data = [
+        {
+          name: "距离",
+          value: (data.dis * unit).toFixed(2),
+        },
+        { name: "X", value: (data.X * unit).toFixed(2) },
+        { name: "Y", value: (data.Y * unit).toFixed(2) },
+        { name: "Z", value: (data.Z * unit).toFixed(2) },
+      ];
+      that.info = result;
+    }
+  }, true);
+}
+//构件距离--服务端渲染
 function distance(that) {
   let api = bimBriefingApi;
   let result = [{ name: "测量结果", data: [] }];
   that.$message.info("请在模型中点击两点，右键结束测量");
   api.Public.clearHandler();
   api.Measurement.clearAllTrace();
+  api.Public.event("LEFT_CLICK", (res) => {
+    api.Measurement.clearAllTrace();
+  });
+  //右键结束测量
+  api.Public.event("RIGHT_CLICK", (res) => {
+    api.Measurement.distance(false);
+  });
+  if (that.isClient) {
+    distanceClient(that);
+    return;
+  }
   let unit = 1;
   api.Feature.getByEvent(true, (n) => {
     if (n && n["id"]) {
@@ -162,19 +282,23 @@ function distance(that) {
     that.info = result;
   });
 
-  api.Public.event("LEFT_CLICK", (res) => {
+  
-    api.Measurement.clearAllTrace();
-  });
-  //右键结束测量
-  api.Public.event("RIGHT_CLICK", (res) => {
-    api.Measurement.distance(false);
-  });
 }
 function getModels(that) {
   return that.models.map((d) => d.modelId);
 }
-//剖切
+//剖切 -- 客户端渲染
+function initClientClipping(that) {
+  let api = bimBriefingApi;
+}
+//剖切 -- 服务端渲染
 function initClipping(that) {
+  api.Public.clearHandler();
+  api.Measurement.clearAllTrace();
+  if(that.isClient){
+    initClientClipping(that);
+    return;
+  }
   let api = bimBriefingApi;
   api.Model.clipByBox(getModels(that));
 }

yanzhu-bigscreen/src/views/bimBriefing.vue

@@ -50,8 +50,8 @@
                     </div>
                     <table class="model-property-table my-table">
                       <tr v-for="(item2, index) in item.data" :key="index">
-                        <th width="50%">{{ item2.propertyName }}</th>
+                        <th width="50%" >{{ item2.propertyName }}</th>
-                        <td width="50%">{{ item2.value }}</td>
+                        <td width="50%" >{{ item2.value }}</td>
                       </tr>
                     </table>
                   </div>
@@ -66,8 +66,8 @@
                     </div>
                     <table class="model-property-table my-table">
                       <tr v-for="(item2, index2) in item.data" :key="index2 + '-' + index">
-                        <th width="50%">{{ item2.name }}</th>
+                        <th width="50%" :class="'txt'+selectMenu+item2.name">{{ item2.name }}</th>
-                        <td width="50%">
+                        <td width="50%" :class="'txt'+selectMenu+item2.name">
                           {{ item2.value }}
                           <span v-if="index == 0">米</span>
                           <span v-if="index == 1">米<sup>2</sup></span>
@@ -216,7 +216,6 @@
 
 <script>
 import debounce from "lodash.debounce";
-import { MergeArray, DelArray } from "@/utils/tools";
 import briefingTools from "./bim/briefingTools";
 import SvgIcon from "@/components/SvgIcon.vue";
 import apiTools from './bim/apiTools.js'
@@ -248,6 +247,7 @@ export default {
       info: [],
       title: "属性",
       showClipping: false,
+       isClient: false,
     };
   },
   mounted() {
@@ -266,6 +266,7 @@ export default {
         this.initEngine();
       })
     );
+    window.bbApp=this
     this.selProject = this.$store.getters.selProject;
     this.initEngine();
   },
@@ -374,6 +375,7 @@ export default {
         this.showClipping = false;
         briefingTools.clearSelectFeature(this);
       }
+      briefingTools.clearSelectFeature(this);
       switch (index) {
         case 0:
           this.resetScene();
@@ -423,6 +425,7 @@ export default {
             it.visible = true;
             api.Model.setVisible(it.modelId, true);
             api.Model.original(it.modelId);
+            bimTools.hideParts(window.bimBriefingApi, this.hideParts);
           });
         } else {
           that.models.forEach((it) => {
@@ -434,6 +437,7 @@ export default {
         if (checked) {
           api.Model.setVisible(node.modelId, true);
           api.Model.original(node.modelId);
+          bimTools.hideParts(window.bimBriefingApi, this.hideParts);
           this.models.find((mm) => mm.modelId == node.modelId).visible = true;
         } else {
           api.Model.setVisible(node.modelId, false);
@@ -462,6 +466,7 @@ export default {
             api.Model.setVisible(node.modelId, true);
             this.models.find((mm) => mm.modelId == node.modelId).visible = true;
             api.Model.original(node.modelId);
+            bimTools.hideParts(window.bimBriefingApi, this.hideParts);
             if (tmps.length > 0) {
               let tmpsIds2 = tmps.splice(0, 1000);
               api.Feature.showFeatures(tmpsIds2.join("#"));
@@ -516,11 +521,7 @@ export default {
       this.attributeInformation = "";
       bimTools.initBimCfg(this);
       setTimeout(() => {
-        if (this.clientShow()) {
+         bimTools.initEngine("bimBriefingApi", "bimBriefingContainer", this.bimCfg, this.initLoadModel);
-          apiTools.loadEngine(this, "bimBriefingContainer", 'bimBriefingApi', this.initLoadModel)
-        } else {
-          sapiTools.loadEngine(this, "bimBriefingContainer", 'bimBriefingApi', this.initLoadModel)
-        }
       }, 10);
     },
     initLoadModel() {
@@ -553,17 +554,29 @@ export default {
           if (this.models.length == 0) {
             this.$message.error("暂无模型，请先关联模型");
           } else {
+             bimTools.addModelList(window.bimBriefingApi, this.bimCfg, this.models, (hideParts) => {
+              setTimeout(() => {
+                bimTools.setDefaultViewPoint(window.bimBriefingApi, this.bimCfg, this.viewPoint)
+                this.hideParts = hideParts;
+                bimTools.hideParts(window.bimBriefingApi, hideParts);
+                this.modelLoaded = true;
+                bimTools.initLoadModel(this, bimBriefingApi)
+                this.resetScene();
+                setTimeout(()=>{
+                  this.doSelectMenu(7);
+                },4000);
+              }, 1000);
+            });
+
             this.models.forEach((item) => {
               item.modelId = item.lightweightName;
               item.gis = JSON.parse(item.gisJson);
-              this.addModel(item.lightweightName);
-              this.doSelectMenu(7);
               setTimeout(() => {
                 this.$refs.tree.setChecked(item.lightweightName, true, true);
               }, 3000);
+             
             });
-            this.treeKey++;
+             this.treeKey++;
-            bimTools.initLoadModel(this, bimBriefingApi)
           }
         });
     },
@@ -621,52 +634,15 @@ export default {
           return tmps;
         };
         node.children = makeTree(objs.filter((item) => item.level == 0));
-        node.children.forEach((item) => {
+       
-          //this.treeExpendedKeys.push(item.key)
-        });
         this.treeKey++;
       });
     },
-    addModel(modelId, cb) {
-      let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
-      let direction = null;
-      let modelInfo = this.models.find(m => m.modelId == modelId);
-      if (this.clientShow()) {
-        url = `/bimdata/Tools/output/model/${modelId}/root.glt`;
-        if (modelInfo) {
-          direction = modelInfo.bimCfg.direction;
-        }
-      }
-      let api = bimBriefingApi
-      console.log(modelId, url);
-      api.Model.add(
-        url,
-        modelId,
-        () => { },
-        () => {
-          cb && cb();
-          console.log("加载模型成功");
-          setTimeout(() => {
-            if (this.viewPoint) {
-              if (!this.clientShow()) {
-                api.Camera.setViewPort(this.viewPoint);
-              }
-            } else {
-              api.Camera.getViewPort((p) => {
-                this.viewPoint = p;
-              });
-            }
-            this.modelLoaded = true;
-          }, 1000);
-        },
-        direction
-      );
-    },
     resetScene() {
-      this.selectedViewpoint = null;
+      bimBriefingApi.Measurement.clearAllTrace()
-      this.selectedRoam = null;
+      bimBriefingApi.Public.clearHandler()
       bimTools.resetScene(this, bimBriefingApi)
-
+      bimTools.hideParts(window.bimBriefingApi, this.hideParts);
     },
   },
 };
@@ -747,6 +723,17 @@ export default {
       margin: 10px;
     }
 
+.model-property-table{
+  .txt4X{
+    color:#f92e2e;
+  }
+   .txt4Y{
+    color:#8fed12;
+  }
+   .txt4Z{
+    color:orange;
+  }
+}
     .hide-list {
       height: calc(100% - 60px);
       overflow-y: auto;

yanzhu-bigscreen/src/views/bimRoaming.vue

@@ -459,15 +459,11 @@ export default {
       bimTools.initBimCfg(this);
       this.elId++;
       this.activeMenu = 0;
-      bimTools.initBimCfg(this);
       setTimeout(() => {
         bimTools.initEngine("bimRoadmApi", "bimRoamingContainer", this.bimCfg, this.initLoadModel);
       }, 10);
     },
     initLoadModel() {
-      if (this.selProject == null) {
-        return;
-      }
       this.$api.bim.getDefaultViewPoint(this.selProject.id, 1).then((d) => {
         let pt = "";
         if (d.data && d.data.length > 0) {