three-base 2.0.72 → 2.0.74

package/threeUtils.js

@@ -1,266 +1,266 @@
-/*
- * @Author: xiaosihan
- * @Date: 2022-02-24 22:49:42
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-05-03 00:36:18
- */
-import { Box3, Clock, EventDispatcher, Material, Vector3 } from "three";
-import { GLTFExporter } from 'three/examples/jsm/exporters/GLTFExporter';
-class ThreeUtils extends EventDispatcher {
-    constructor() {
-        super();
-        this.requestAnimationFrame();
-    }
-    isProd = (process.env.NODE_ENV === "production");
-    isDev = (process.env.NODE_ENV === "development");
-    _timeTemp = performance.now();
-    _accumulate = 0; // 事件分发次数
-    _box3 = new Box3();
-    _size = new Vector3();
-    _center = new Vector3();
-    _clock = new Clock();
-    requestAnimationFrame() {
-        this._accumulate += 1;
-        const timeTemp = this._timeTemp = performance.now();
-        this.dispatchEvent({
-            type: "requestAnimationFrame",
-            timeTemp,
-            accumulate: this._accumulate
-        });
-        this._computerDomZoom();
-        //执行一个计划任务
-        let work = this.workList.splice(0, 1)[0];
-        work && work();
-        setTimeout(() => {
-            this.requestAnimationFrame();
-        }, 30 - this._clock.getDelta());
-    }
-    // 需要保持宽高比的元素列表
-    _keepZoomDoms = [];
-    /**
-     *计算需要保持比例的元素
-     */
-    _computerDomZoom() {
-        //1. 踢除没有出现在页面上的 dom 元素
-        this._keepZoomDoms = this._keepZoomDoms.filter(l => this.inDocument(l.dom));
-        //2.设置dom的缩放值样式
-        this._keepZoomDoms.map((item, i) => {
-            let parentDom = item.dom.parentNode;
-            let scale = Math.min(parentDom.clientWidth / item.width, parentDom.clientHeight / item.height);
-            Object.assign(item.dom.style, {
-                position: "absolute",
-                top: "50%",
-                left: "50%",
-                transform: `translate(-50%, -50%) scale(${scale})`,
-                width: `${item.width}px`,
-                height: `${item.height}px`
-            });
-        });
-    }
-    /**
-     * dom元素保持比例
-     */
-    keepZoom(dom, width = 1920, height = 1080) {
-        if (dom) {
-            // 去掉相同的dom存储的信息
-            this._keepZoomDoms = this._keepZoomDoms.filter(l => l.dom !== dom);
-            // 把配置加入到列表中
-            this._keepZoomDoms.push({ dom, width, height });
-            dom.dataset.a = "这个元素缩放比例由 threeUtils.keepZoom 方法设置";
-            this._computerDomZoom();
-        }
-    }
-    workList = [];
-    // 时钟对象
-    clock = new Clock();
-    // 按照任务队列依次执行计划任务 性能优化
-    /**
-     * @param {() => void} [callback]
-     * @param {boolean} [first=true] 需要优先执行
-     */
-    addWork(work, first = false) {
-        // 加入任务队列
-        if (work && !this.workList.includes(work)) {
-            if (first) {
-                this.workList.splice(1, 0, work); // 优先执行的任务回调
-            }
-            else {
-                this.workList.push(work);
-            }
-        }
-    }
-    /**
-     *判断一个元素是否在页面上
-     */
-    inDocument(dom) {
-        if (dom === null) {
-            return false;
-        }
-        else if (dom.parentNode === null) {
-            return false;
-        }
-        else if (dom.parentNode === document) {
-            return true;
-        }
-        else {
-            return this.inDocument(dom.parentNode);
-        }
-    }
-    // 获取中心点
-    getCenter(object3d) {
-        if (object3d.isObject3D) {
-            this._box3.setFromObject(object3d);
-            this._box3.getCenter(this._center);
-        }
-        else if (object3d.isBufferGeometry) {
-            object3d.computeBoundingBox();
-            object3d.boundingBox.getCenter(this._center);
-        }
-        return this._center.clone();
-    }
-    // 获取模型大小
-    getSize(object3d) {
-        if (object3d.isObject3D) {
-            this._box3.setFromObject(object3d);
-            this._box3.getSize(this._size);
-        }
-        else if (object3d.isBufferGeometry) {
-            object3d.computeBoundingBox();
-            object3d.boundingBox.getSize(this._size);
-        }
-        return this._size.clone();
-    }
-    // 模型对齐底面
-    alignBottom(object3d, y = 0) {
-        if (object3d.isObject3D) {
-            this._box3.setFromObject(object3d);
-            this._box3.getCenter(this._center);
-            this._box3.getSize(this._size);
-            object3d.position.y -= (this._center.y - (this._size.y * 0.5));
-            object3d.position.y += y;
-            object3d.updateMatrixWorld(true);
-        }
-        else if (object3d.isBufferGeometry) {
-            object3d.computeBoundingBox();
-            object3d.translate(0, -object3d.boundingBox.min.y + y, 0);
-        }
-    }
-    // 居中对象
-    centerObject3D(object3d) {
-        if (object3d.isObject3D) {
-            this._box3.setFromObject(object3d);
-            this._box3.getCenter(this._center);
-            object3d.position.sub(this._center);
-            object3d.updateMatrixWorld(true);
-        }
-        else if (object3d.isBufferGeometry) {
-            object3d.center();
-        }
-    }
-    //居中对象
-    center(object3d) {
-        this.centerObject3D(object3d);
-    }
-    // 使用指定的维度(xyz)计算, 缩放至指定大小;
-    scaleTo(object3d, size = 1, key = ["x", "y", "z"]) {
-        const originSize = this.getSize(object3d);
-        const scale = size / Math.max(...key.map(k => originSize[k]));
-        if (object3d.isObject3D) {
-            object3d.scale.multiplyScalar(scale);
-            object3d.updateMatrixWorld(true);
-        }
-        else if (object3d.isBufferGeometry) {
-            object3d.scale(scale, scale, scale);
-        }
-    }
-    // 应用全部变化
-    applyAllTranstion(object3d) {
-        object3d.updateMatrixWorld(true);
-        // 应用全部变换
-        object3d.traverse(obj => {
-            obj.position.set(0, 0, 0);
-            obj.rotation.set(0, 0, 0);
-            obj.scale.set(1, 1, 1);
-            if (obj.isMesh) {
-                obj.geometry.applyMatrix4(obj.matrixWorld);
-            }
-        });
-    }
-    // 导出 glb
-    exportGLB(input, fileName = "threeUtils.exportGLB") {
-        const gltfExporter = new GLTFExporter();
-        gltfExporter.parse(input, (result) => {
-            if (result instanceof ArrayBuffer) {
-                const link = document.createElement('a');
-                link.style.display = 'none';
-                document.body.appendChild(link); // Firefox workaround, see #6594
-                link.href = URL.createObjectURL(new Blob([result], { type: 'application/octet-stream' }));
-                link.download = `${fileName}.glb`;
-                link.click();
-            }
-        }, (error) => { }, {
-            trs: true,
-            onlyVisible: true,
-            binary: true,
-            maxTextureSize: 4096
-        });
-    }
-    //导出usdz
-    exportUsdz() {
-    }
-    // 计算网格的体积
-    getVolume(geometry) {
-        if (!geometry.index)
-            return;
-        if (!geometry.isBufferGeometry) {
-            console.log("'geometry' must be an indexed or non-indexed buffer geometry");
-            return 0;
-        }
-        const isIndexed = geometry.index !== null;
-        const position = geometry.attributes.position;
-        let sum = 0;
-        const p1 = new Vector3(), p2 = new Vector3(), p3 = new Vector3();
-        if (!isIndexed) {
-            const faces = position.count / 3;
-            for (let i = 0; i < faces; i++) {
-                p1.fromBufferAttribute(position, i * 3 + 0);
-                p2.fromBufferAttribute(position, i * 3 + 1);
-                p3.fromBufferAttribute(position, i * 3 + 2);
-                sum += this.signedVolumeOfTriangle(p1, p2, p3);
-            }
-        }
-        else {
-            const index = geometry.index;
-            const faces = index.count / 3;
-            for (let i = 0; i < faces; i++) {
-                p1.fromBufferAttribute(position, index.array[i * 3 + 0]);
-                p2.fromBufferAttribute(position, index.array[i * 3 + 1]);
-                p3.fromBufferAttribute(position, index.array[i * 3 + 2]);
-                sum += this.signedVolumeOfTriangle(p1, p2, p3);
-            }
-        }
-        return sum > 0 ? sum : 0;
-    }
-    signedVolumeOfTriangle(p1, p2, p3) {
-        return p1.dot(p2.cross(p3)) / 6.0;
-    }
-    //清理对象的网格和材质的缓存
-    dipose(object3d) {
-        object3d.traverse(obj => {
-            const mesh = obj;
-            if (mesh.isMesh) {
-                mesh.geometry.dispose();
-                if (mesh.material instanceof Material) {
-                    mesh.material.dispose();
-                }
-                else if (mesh.material instanceof Array) {
-                    mesh.material.map(m => {
-                        m.dispose();
-                    });
-                }
-            }
-        });
-    }
-}
-const threeUtils = new ThreeUtils();
-export default threeUtils;
+/*
+ * @Author: xiaosihan
+ * @Date: 2022-02-24 22:49:42
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-05-03 00:36:18
+ */
+import { Box3, Clock, EventDispatcher, Material, Vector3 } from "three";
+import { GLTFExporter } from 'three/examples/jsm/exporters/GLTFExporter';
+class ThreeUtils extends EventDispatcher {
+    constructor() {
+        super();
+        this.requestAnimationFrame();
+    }
+    isProd = (process.env.NODE_ENV === "production");
+    isDev = (process.env.NODE_ENV === "development");
+    _timeTemp = performance.now();
+    _accumulate = 0; // 事件分发次数
+    _box3 = new Box3();
+    _size = new Vector3();
+    _center = new Vector3();
+    _clock = new Clock();
+    requestAnimationFrame() {
+        this._accumulate += 1;
+        const timeTemp = this._timeTemp = performance.now();
+        this.dispatchEvent({
+            type: "requestAnimationFrame",
+            timeTemp,
+            accumulate: this._accumulate
+        });
+        this._computerDomZoom();
+        //执行一个计划任务
+        let work = this.workList.splice(0, 1)[0];
+        work && work();
+        setTimeout(() => {
+            this.requestAnimationFrame();
+        }, 30 - this._clock.getDelta());
+    }
+    // 需要保持宽高比的元素列表
+    _keepZoomDoms = [];
+    /**
+     *计算需要保持比例的元素
+     */
+    _computerDomZoom() {
+        //1. 踢除没有出现在页面上的 dom 元素
+        this._keepZoomDoms = this._keepZoomDoms.filter(l => this.inDocument(l.dom));
+        //2.设置dom的缩放值样式
+        this._keepZoomDoms.map((item, i) => {
+            let parentDom = item.dom.parentNode;
+            let scale = Math.min(parentDom.clientWidth / item.width, parentDom.clientHeight / item.height);
+            Object.assign(item.dom.style, {
+                position: "absolute",
+                top: "50%",
+                left: "50%",
+                transform: `translate(-50%, -50%) scale(${scale})`,
+                width: `${item.width}px`,
+                height: `${item.height}px`
+            });
+        });
+    }
+    /**
+     * dom元素保持比例
+     */
+    keepZoom(dom, width = 1920, height = 1080) {
+        if (dom) {
+            // 去掉相同的dom存储的信息
+            this._keepZoomDoms = this._keepZoomDoms.filter(l => l.dom !== dom);
+            // 把配置加入到列表中
+            this._keepZoomDoms.push({ dom, width, height });
+            dom.dataset.a = "这个元素缩放比例由 threeUtils.keepZoom 方法设置";
+            this._computerDomZoom();
+        }
+    }
+    workList = [];
+    // 时钟对象
+    clock = new Clock();
+    // 按照任务队列依次执行计划任务 性能优化
+    /**
+     * @param {() => void} [callback]
+     * @param {boolean} [first=true] 需要优先执行
+     */
+    addWork(work, first = false) {
+        // 加入任务队列
+        if (work && !this.workList.includes(work)) {
+            if (first) {
+                this.workList.splice(1, 0, work); // 优先执行的任务回调
+            }
+            else {
+                this.workList.push(work);
+            }
+        }
+    }
+    /**
+     *判断一个元素是否在页面上
+     */
+    inDocument(dom) {
+        if (dom === null) {
+            return false;
+        }
+        else if (dom.parentNode === null) {
+            return false;
+        }
+        else if (dom.parentNode === document) {
+            return true;
+        }
+        else {
+            return this.inDocument(dom.parentNode);
+        }
+    }
+    // 获取中心点
+    getCenter(object3d) {
+        if (object3d.isObject3D) {
+            this._box3.setFromObject(object3d);
+            this._box3.getCenter(this._center);
+        }
+        else if (object3d.isBufferGeometry) {
+            object3d.computeBoundingBox();
+            object3d.boundingBox.getCenter(this._center);
+        }
+        return this._center.clone();
+    }
+    // 获取模型大小
+    getSize(object3d) {
+        if (object3d.isObject3D) {
+            this._box3.setFromObject(object3d);
+            this._box3.getSize(this._size);
+        }
+        else if (object3d.isBufferGeometry) {
+            object3d.computeBoundingBox();
+            object3d.boundingBox.getSize(this._size);
+        }
+        return this._size.clone();
+    }
+    // 模型对齐底面
+    alignBottom(object3d, y = 0) {
+        if (object3d.isObject3D) {
+            this._box3.setFromObject(object3d);
+            this._box3.getCenter(this._center);
+            this._box3.getSize(this._size);
+            object3d.position.y -= (this._center.y - (this._size.y * 0.5));
+            object3d.position.y += y;
+            object3d.updateMatrixWorld(true);
+        }
+        else if (object3d.isBufferGeometry) {
+            object3d.computeBoundingBox();
+            object3d.translate(0, -object3d.boundingBox.min.y + y, 0);
+        }
+    }
+    // 居中对象
+    centerObject3D(object3d) {
+        if (object3d.isObject3D) {
+            this._box3.setFromObject(object3d);
+            this._box3.getCenter(this._center);
+            object3d.position.sub(this._center);
+            object3d.updateMatrixWorld(true);
+        }
+        else if (object3d.isBufferGeometry) {
+            object3d.center();
+        }
+    }
+    //居中对象
+    center(object3d) {
+        this.centerObject3D(object3d);
+    }
+    // 使用指定的维度(xyz)计算, 缩放至指定大小;
+    scaleTo(object3d, size = 1, key = ["x", "y", "z"]) {
+        const originSize = this.getSize(object3d);
+        const scale = size / Math.max(...key.map(k => originSize[k]));
+        if (object3d.isObject3D) {
+            object3d.scale.multiplyScalar(scale);
+            object3d.updateMatrixWorld(true);
+        }
+        else if (object3d.isBufferGeometry) {
+            object3d.scale(scale, scale, scale);
+        }
+    }
+    // 应用全部变化
+    applyAllTranstion(object3d) {
+        object3d.updateMatrixWorld(true);
+        // 应用全部变换
+        object3d.traverse(obj => {
+            obj.position.set(0, 0, 0);
+            obj.rotation.set(0, 0, 0);
+            obj.scale.set(1, 1, 1);
+            if (obj.isMesh) {
+                obj.geometry.applyMatrix4(obj.matrixWorld);
+            }
+        });
+    }
+    // 导出 glb
+    exportGLB(input, fileName = "threeUtils.exportGLB") {
+        const gltfExporter = new GLTFExporter();
+        gltfExporter.parse(input, (result) => {
+            if (result instanceof ArrayBuffer) {
+                const link = document.createElement('a');
+                link.style.display = 'none';
+                document.body.appendChild(link); // Firefox workaround, see #6594
+                link.href = URL.createObjectURL(new Blob([result], { type: 'application/octet-stream' }));
+                link.download = `${fileName}.glb`;
+                link.click();
+            }
+        }, (error) => { }, {
+            trs: true,
+            onlyVisible: true, // 只导出可见的
+            binary: true, // glb
+            maxTextureSize: 4096
+        });
+    }
+    //导出usdz
+    exportUsdz() {
+    }
+    // 计算网格的体积
+    getVolume(geometry) {
+        if (!geometry.index)
+            return;
+        if (!geometry.isBufferGeometry) {
+            console.log("'geometry' must be an indexed or non-indexed buffer geometry");
+            return 0;
+        }
+        const isIndexed = geometry.index !== null;
+        const position = geometry.attributes.position;
+        let sum = 0;
+        const p1 = new Vector3(), p2 = new Vector3(), p3 = new Vector3();
+        if (!isIndexed) {
+            const faces = position.count / 3;
+            for (let i = 0; i < faces; i++) {
+                p1.fromBufferAttribute(position, i * 3 + 0);
+                p2.fromBufferAttribute(position, i * 3 + 1);
+                p3.fromBufferAttribute(position, i * 3 + 2);
+                sum += this.signedVolumeOfTriangle(p1, p2, p3);
+            }
+        }
+        else {
+            const index = geometry.index;
+            const faces = index.count / 3;
+            for (let i = 0; i < faces; i++) {
+                p1.fromBufferAttribute(position, index.array[i * 3 + 0]);
+                p2.fromBufferAttribute(position, index.array[i * 3 + 1]);
+                p3.fromBufferAttribute(position, index.array[i * 3 + 2]);
+                sum += this.signedVolumeOfTriangle(p1, p2, p3);
+            }
+        }
+        return sum > 0 ? sum : 0;
+    }
+    signedVolumeOfTriangle(p1, p2, p3) {
+        return p1.dot(p2.cross(p3)) / 6.0;
+    }
+    //清理对象的网格和材质的缓存
+    dipose(object3d) {
+        object3d.traverse(obj => {
+            const mesh = obj;
+            if (mesh.isMesh) {
+                mesh.geometry.dispose();
+                if (mesh.material instanceof Material) {
+                    mesh.material.dispose();
+                }
+                else if (mesh.material instanceof Array) {
+                    mesh.material.map(m => {
+                        m.dispose();
+                    });
+                }
+            }
+        });
+    }
+}
+const threeUtils = new ThreeUtils();
+export default threeUtils;