开发4D模拟

yanzhu-bigscreen/public/index.html

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

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

@@ -143,7 +143,7 @@ const ganttStyle = {
 };
 
 function initEngine(that) {
-  console.log("开始初始化引擎")
+  console.log("开始初始化引擎");
   window.bim4DApi = new SAPI(
     {
       serverIP: window.config.serverIP, //服务ip地址
@@ -240,6 +240,7 @@ function addModel(that, modelId, cb) {
           that.viewPoint = p;
           that.modelLoaded = true;
         });
+        that.initPlay();
       }, 1000);
     }
   );
@@ -251,9 +252,8 @@ function showBim(that, index) {
   if (index <= 0) {
     index = getCurrentTaskIndex(that);
   }
-  console.log(index);
   let showFeatureIds = [];
-  let currFeatureId = [];
+  let currFeatureIds = [];
   for (let i = 0; i <= that.taskList.length; i++) {
     if (i <= index) {
       that.taskList[i].gis.forEach((item) => {
@@ -265,13 +265,20 @@ function showBim(that, index) {
     }
   }
   if (showFeatureIds.length > 0) {
-    let featureId = showFeatureIds[0];
-    let modelId = featureId.split("_")[0];
-    let tmpsIds2 = showFeatureIds.splice(0, maxLen);
-    api.Model.original(modelId);
-    api.Feature.showFeatures(tmpsIds2.join("#"));
     setFeatueVisible(showFeatureIds, true);
   }
+  setTimeout(() => {
+    that.lastFeatureIds.forEach((it) => {
+      api.Feature.setColor(it, "rgba(255,255,255,1)");
+    });
+    currFeatureIds = that.taskList[index].gis.map((item) => item.featureId);
+    if (currFeatureIds.length > 0) {
+      currFeatureIds.forEach((it) => {
+        api.Feature.setColor(it, "rgba(255,0,255,1)");
+      });
+    }
+    that.lastFeatureIds = currFeatureIds;
+  }, 0);
 }
 
 function setFeatueVisible(featureIds, show) {
@@ -299,10 +306,73 @@ function getCurrentTaskIndex(that) {
   return index;
 }
 
+function resetScene(that) {
+  let api = bim4DApi;
+  api.Camera.stopImmersiveRoam();
+  api.Model.location(api.m_model.keys().toArray()[0]);
+  api.Plugin.deleteMiniMap();
+  if (that.viewPoint) {
+    api.Camera.setViewPort(that.viewPoint);
+  }
+}
+
+function original() {
+  let api = bim4DApi;
+  for (let modelId in api.m_model) {
+    api.Model.original(modelId);
+  }
+}
+
+function getFirstFeatureId(that) {
+  for (let i = 0; i < that.taskList.length; i++) {
+    let task = that.taskList[i];
+    if (task.gis.length > 0) {
+      return task.gis[0].featureId;
+    }
+  }
+  return "";
+}
+
+function preparePlay(that) {
+  let featureId = getFirstFeatureId(that);
+  if (!featureId) {
+    return;
+  }
+  let api = bim4DApi;
+  api.Feature.showFeatures(featureId);
+  api.Feature.setColor(featureId, "rgba(255,255,255,0)");
+}
+
+function playStop(that) {
+  let api = bim4DApi;
+  that.lastFeatureIds.forEach((it) => {
+    api.Feature.setColor(it, "rgba(255,255,255,1)");
+  });
+}
+
+function doPLay(that) {
+  that.playTimer = setInterval(() => {
+    that.playValue++;
+    if (that.playValue >= that.taskList.length) {
+      playStop(that);
+      that.doStop();
+    } else {
+      that.doPlayPan(that.playValue);
+    }
+  }, that.playTime);
+}
+
 export default {
   options,
   ganttStyle,
   initEngine,
   initLoadModel,
   showBim,
+  resetScene,
+  original,
+  getFirstFeatureId,
+  preparePlay,
+  playStop,
+  getCurrentTaskIndex,
+  doPLay,
 };

yanzhu-bigscreen/src/views/bim4DSimulation.vue

@@ -11,7 +11,20 @@
         <div class="icon" @click="doPlay">
           <svg-icon icon-class="play" />
         </div>
-        <div class="icon"><svg-icon icon-class="tools" /></div>
+        <el-popover title="" trigger="click" placement="top" ref="popSetting" @show="showSetting">
+          <div>
+            <div>
+              <i class="el-icon-info" style="color: orange"></i>
+              设置间隔时间(单位:毫秒,最小值为500)
+            </div>
+            <el-input v-model="playTime" placeholder="请输入播放速度" />
+            <div style="margin-top: 10px; text-align: right">
+              <el-button type="primary" size="mini" @click="doSaveSetting">确定</el-button>
+              <el-button size="mini" @click="doCancelSetting">取消</el-button>
+            </div>
+          </div>
+          <div class="icon" slot="reference"><svg-icon icon-class="tools" /></div>
+        </el-popover>
       </template>
 
       <template v-if="isPlay == 1">
@@ -27,6 +40,9 @@
         <div class="icon" @click="doContinue">
           <svg-icon icon-class="play" />
         </div>
+        <div class="icon" @click="doStop">
+          <svg-icon icon-class="stop" />
+        </div>
       </template>
 
       <el-slider v-model="playValue" :max="taskList.length" class="slider" @change="doSliderChange" />
@@ -66,8 +82,9 @@ export default {
       planStyle: bim4DTools.ganttStyle,
       playValue: 0,
       isPlay: 0,
-      playTime: 300,
+      playTime: 500,
       showPlan: true,
+      lastFeatureIds: [],
     };
   },
   beforeDestroy() {
@@ -97,6 +114,22 @@ export default {
     window.D4App = this;
   },
   methods: {
+    doSaveSetting() {
+      if (isNaN(parseInt(this.playTime))) {
+        this.playTime = 500;
+      }
+      if (this.playTime < 500) {
+        this.playTime = 500;
+      }
+      this.$refs.popSetting.showPopper = false;
+    },
+    doCancelSetting() {
+      this.playTime = this.oldPlayTime;
+      this.$refs.popSetting.showPopper = false;
+    },
+    showSetting() {
+      this.oldPlayTime = this.playTime;
+    },
     initEngine() {
       this.elId++;
       setTimeout(() => {
@@ -106,6 +139,17 @@ export default {
     doSwitchPlan() {
       this.showPlan = !this.showPlan;
     },
+    initPlay() {
+      if (!bim4DTools.getFirstFeatureId(this)) {
+        this.$message.error("未配置计划进度，无法播放!");
+        return;
+      }
+      let playIndex = bim4DTools.getCurrentTaskIndex(this);
+      if (playIndex > 0) {
+        bim4DTools.preparePlay(this);
+        this.doPlayPan(playIndex);
+      }
+    },
     initPlanList() {
       if (this.selProject?.id) {
         this.$api.bim.getPlanList(this.selProject.id).then((res) => {
@@ -116,6 +160,7 @@ export default {
               label: item.taskName,
               start: item.planStartDate,
               end: item.planEndDate,
+              percent: 100,
               duration: item.taskDuation * 24 * 60 * 60 * 1000,
               days: item.taskDuation + "(天)",
               collapsed: false,
@@ -136,19 +181,23 @@ export default {
       }
     },
     playPlay() {
-      this.playTimer = setInterval(() => {
+      bim4DTools.original();
-        this.playValue++;
+      bim4DTools.resetScene(this);
-        if (this.playValue > this.taskList.length) {
+      this.lastFeatureIds = [];
-          this.doStop();
+      if (!bim4DTools.getFirstFeatureId(this)) {
-        } else {
+        this.$message.error("未配置计划进度，无法播放!");
-          this.doSliderChange();
+        return;
-        }
+      }
-      }, this.playTime);
+      bim4DTools.preparePlay(this);
+      bim4DTools.doPLay(this);
     },
-    doSliderChange() {
+    doPlayPan(playIndex) {
-      let task = this.taskList[this.playValue];
+      if (playIndex >= this.taskList.length) {
+        return;
+      }
+      let task = this.taskList[playIndex];
       this.$refs.gantt.scrollToTime(this.$dt(task.start));
-      console.log(task.start);
+
       let d = this.$dt(task.start).$d;
       const current = +d;
       const currentOffset = this.$refs.gantt.timeToPixelOffsetX(current);
@@ -157,8 +206,21 @@ export default {
         el.setAttribute("x1", currentOffset);
         el.setAttribute("x2", currentOffset);
       }
-      this.$refs.gantt.scrollTo(null, 36 * this.playValue);
+      this.$refs.gantt.scrollTo(null, 36 * playIndex);
-      bim4DTools.showBim(this, this.playValue);
+      bim4DTools.showBim(this, playIndex);
+    },
+    doSliderChange() {
+      this.isPlay = 0;
+      clearInterval(this.playTimer);
+      bim4DTools.original();
+      bim4DTools.resetScene(this);
+      this.lastFeatureIds = [];
+      if (!bim4DTools.getFirstFeatureId(this)) {
+        this.$message.error("未配置计划进度，无法播放!");
+        return;
+      }
+      bim4DTools.preparePlay(this);
+      this.doPlayPan(this.playValue);
     },
     doPlay() {
       this.isPlay = 1;
@@ -176,7 +238,7 @@ export default {
     },
     doContinue() {
       this.isPlay = 1;
-      this.playPlay();
+      bim4DTools.doPLay(this);
     },
   },
 };
@@ -264,6 +326,7 @@ export default {
       .svg-icon {
         width: 24px;
         height: 24px;
+        fill: deepskyblue;
       }
     }
     .el-slider {
@@ -291,12 +354,14 @@ export default {
   }
   .icon-switch-plan {
     position: absolute;
-    top: 40px;
+    top: 100px;
     right: 40px;
     cursor: pointer;
     .svg-icon {
       width: 30px;
       height: 30px;
+      fill: darkturquoise;
+      z-index: 9999;
     }
   }
 }