fl-web-component 1.2.6 → 1.2.8

package/dist/fl-web-component.css

@@ -1 +1 @@
-@charset "UTF-8";#fl-model[data-v-4cb5675d],#konva-container[data-v-1eba8e28]{width:100%;height:100%;cursor:pointer}#konva-container[data-v-1eba8e28]{z-index:3;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:flex;flex-direction:column;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:flex;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}#svg-tigger[data-v-0ec35ee4]{cursor:pointer;height:100%;width:100%}
+@charset "UTF-8";#fl-model[data-v-9d23b864],#konva-container[data-v-1eba8e28]{width:100%;height:100%;cursor:pointer}#konva-container[data-v-1eba8e28]{z-index:3;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:flex;flex-direction:column;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:flex;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}#svg-tigger[data-v-0ec35ee4]{cursor:pointer;height:100%;width:100%}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fl-web-component",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "scripts": {
     "tip1": "仅调试本组件不涉及业务组件,请执行dev",
     "dev": "vue-cli-service serve",

package/packages/components/com-graphics/index.vue

@@ -168,7 +168,7 @@
         renderer.autoClearStencil = false;
       },
       initScene() {
-        // modelGroup = new this.THREE.Group();
+        modelGroup = new this.THREE.Group();
         scene = new this.THREE.Scene();
       },
       initCamera() {
@@ -216,8 +216,7 @@
         }
         const { instances, drawObjs } = parseData(data);
         if (instances.length > 0) {
-          modelGroup = new this.THREE.Group();
-          modelGroup = handleInstancedMeshModel(
+          handleInstancedMeshModel(modelGroup,
             instances,
             drawObjs,
             '',
@@ -269,6 +268,7 @@
           });
           // cameraControls.fitToSphere(scene, true); // TODO 待处理，先用 setModelCenter 进行定位
           this.setModelCenter(modelGroup);
+          console.log(modelGroup)
           this.$emit('modelLoaded')
           // cameraControls.saveState();
         }
@@ -669,10 +669,14 @@
       },
       // 删除场景中所有的实体
       removeAll() {
-        let length = modelGroup?.children?.length 
-        if (scene && length > 0) {
-          this.removeTraverse()
-        }
+        return new Promise((resolve) => {
+          if (scene) {
+            this.removeTraverse()
+            resolve()
+          } else {
+            resolve()
+          }
+        })
       },
       removeTraverse() {
         let length = modelGroup.children.length
@@ -683,21 +687,22 @@
               item.material.dispose();
               item.geometry.dispose();
               item.clear();
+              item.material = null;
+              item.geometry = null;
               modelGroup.remove(item);
+              item = null;
             }
           });
           modelGroup.remove(list);
           this.removeTraverse();
         } else {
           // 在这里清除一些标记之类的
-          scene.traverse(item => {
-            scene.remove(item)
-          })
+          modelGroup.clear();
           scene.remove(modelGroup);
           renderer.clear();
-          modelGroup = null
+          modelGroup = null;
+          modelGroup = new this.THREE.Group();
         }
-
       },
       // 销毁场景 释放内存
       destroyScene() {

package/src/utils/instance-parser.js

@@ -26,6 +26,7 @@ let drawObjMapInstance = {};
  * @param {Array} drawObjs - 绘制对象数组，包含几何数据
  */
 function handleInstancedMeshModel(
+  modelGroup,
   instances,
   drawObjs,
   type,
@@ -34,8 +35,9 @@ function handleInstancedMeshModel(
   meshNameConfig,
   customOpacity
 ) {
+  drawObjMapInstance = {};
   // 第一阶段：构建实例映射表
-  let modelGroup = new THREE.Group();
+  // let modelGroup = new THREE.Group();
   for (let i = 0; i < instances.length; i++) {
     formatInstancedMap(instances[i], drawObjs);
   }