three-base 2.0.26 → 2.0.29

package/MeshBase.d.ts

@@ -1,4 +1,28 @@
-import { Group } from "three";
+import { AnimationAction, AnimationMixer, Clock, Group, Mesh, Object3D, Vector3 } from "three";
 export default class MeshBase extends Group {
-    constructor();
+    constructor(url?: string);
+    static models: Map<string, Object3D>;
+    static loadModeling: Map<string, boolean>;
+    loaded: boolean;
+    hasAnimation: boolean;
+    mixer?: AnimationMixer;
+    animationActions: {
+        [key: string]: AnimationAction;
+    };
+    loadModel(url: string): Promise<void>;
+    frustumCulled: boolean;
+    castShadow: boolean;
+    receiveShadow: boolean;
+    awaitLoaded(callback?: Function): Promise<void>;
+    traverseMesh(callback: (mesh: Mesh) => void): Promise<void>;
+    clock: Clock;
+    setClipActionWeight(weights?: {
+        [key: string]: number;
+    }): Promise<void>;
+    updateMatrix(): void;
+    getSize(): Promise<Vector3>;
+    center(): Promise<void>;
+    alignBottom(y?: number): Promise<void>;
+    scaleTo(size?: number, key?: Array<"x" | "y" | "z">): Promise<void>;
+    expandBynormal(length: number): void;
 }

package/MeshBase.js

@@ -1,13 +1,174 @@
-/*
- * @Author: xiaosihan
- * @Date: 2024-01-29 10:08:40
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2024-02-05 09:40:17
- */
-import { Group } from "three";
-// 基础模型加载对象
+import { AnimationMixer, Clock, Group, Object3D, Vector3 } from "three";
+import threeUtils from "./threeUtils";
+import threeLoader from "./threeLoader";
+import * as SkeletonUtils from 'three/examples/jsm/utils/SkeletonUtils';
+// 模型基类
 export default class MeshBase extends Group {
-    constructor() {
+    constructor(url) {
         super();
+        url && this.loadModel(url);
+    }
+    // 模型对象
+    static models = new Map();
+    // 模型是否在加载中
+    static loadModeling = new Map();
+    // 加载完成
+    loaded = false;
+    // 是否有动画
+    hasAnimation = false;
+    //动画混合器
+    mixer;
+    //动画剪辑对象数组
+    animationActions = {};
+    async loadModel(url) {
+        if (!url) {
+            this.clear();
+            return;
+        }
+        this.loaded = false;
+        // 没有模型并且没有加载任务时就去加载模型
+        if (!MeshBase.models.get(url) && !MeshBase.loadModeling.get(url)) {
+            MeshBase.loadModeling.set(url, true);
+            let modal = new Object3D();
+            if (/\.fbx$/i.test(url)) {
+                await threeLoader.fbxLoader.loadAsync(url).then(res => {
+                    modal = res;
+                }).catch(() => {
+                    console.error(`${url},加载失败`);
+                });
+            }
+            else if (/\.(gltf|glb)$/i.test(url)) {
+                await threeLoader.gltfLoader.loadAsync(url).then(res => {
+                    modal = res.scene;
+                    modal.animations = res.animations;
+                }).catch(() => {
+                    console.error(`${url},加载失败`);
+                });
+            }
+            else {
+                console.error(`${url},不支持的格式`);
+            }
+            threeUtils.center(modal);
+            threeUtils.alignBottom(modal);
+            modal.updateMatrixWorld(true);
+            MeshBase.models.set(url, modal);
+            MeshBase.loadModeling.set(url, false);
+        }
+        // 如果模型还在加载中, 就等待模型加载完成
+        do {
+            await new Promise(resolve => setTimeout(resolve, 50));
+        } while (MeshBase.loadModeling.get(url));
+        if (MeshBase.models.get(url)) {
+            this.clear();
+            const mesh = MeshBase.models.get(url);
+            // 判断是否有动画
+            this.hasAnimation = mesh.animations.length > 0;
+            if (this.hasAnimation) {
+                const model = SkeletonUtils.clone(mesh);
+                this.mixer = new AnimationMixer(model);
+                this.animationActions = {};
+                mesh.animations.map(animation => {
+                    const animationAction = this.mixer.clipAction(animation).play();
+                    animationAction.weight = 0;
+                    this.animationActions[animation.name] = animationAction;
+                });
+                this.add(model);
+            }
+            else {
+                this.add(mesh);
+            }
+        }
+        await new Promise(resolve => requestAnimationFrame(resolve));
+        // 加载完成事件
+        this.dispatchEvent({ type: "loaded" });
+        this.loaded = true;
+    }
+    // 超出绘制区域时不绘制
+    frustumCulled = false;
+    // 创建阴影
+    castShadow = false;
+    // 接受阴影
+    receiveShadow = false;
+    // 等待加载加载完成
+    async awaitLoaded(callback) {
+        while (!this.loaded) {
+            await new Promise(resolve => setTimeout(resolve, 50));
+        }
+        callback && callback();
+    }
+    //遍历模型
+    async traverseMesh(callback) {
+        // 等待加载完成
+        await this.awaitLoaded();
+        this.traverse(obj => {
+            const mesh = obj;
+            if (mesh.isMesh) {
+                callback(mesh);
+            }
+        });
+    }
+    clock = new Clock();
+    //设置动画的权重
+    async setClipActionWeight(weights = {}) {
+        // 等待加载完成
+        await this.awaitLoaded();
+        for (let key in this.animationActions) {
+            this.animationActions[key].weight = weights[key] || 0;
+        }
+    }
+    updateMatrix() {
+        //播放动画
+        if (this.mixer) {
+            this.mixer.update(this.clock.getDelta());
+        }
+        // 深度应用属性
+        this.traverse(obj => {
+            const mesh = obj;
+            if (mesh.isMesh) {
+                mesh.frustumCulled = this.frustumCulled;
+                mesh.castShadow = this.castShadow;
+                mesh.receiveShadow = this.receiveShadow;
+            }
+        });
+        super.updateMatrix();
+    }
+    // 获取模型的尺寸
+    async getSize() {
+        await this.awaitLoaded();
+        return threeUtils.getSize(this);
+    }
+    // 居中
+    async center() {
+        await this.awaitLoaded();
+        threeUtils.center(this);
+    }
+    //底对齐
+    async alignBottom(y = 0) {
+        await this.awaitLoaded();
+        threeUtils.alignBottom(this, y);
+    }
+    // 放大到指定尺寸
+    async scaleTo(size = 1, key = ["x", "y", "z"]) {
+        await this.awaitLoaded();
+        threeUtils.scaleTo(this, size, key);
+    }
+    //按照法线拓展
+    expandBynormal(length) {
+        this.traverseMesh(mesh => {
+            // 没有法线就计算法线
+            mesh.geometry = mesh.geometry.clone();
+            if (!mesh.geometry.getAttribute("normal")) {
+                mesh.geometry.computeVertexNormals();
+            }
+            const normal = mesh.geometry.getAttribute("normal");
+            const position = mesh.geometry.getAttribute("position");
+            const v3 = new Vector3(0, 0, 0);
+            for (let i = 0; i < position.count; i++) {
+                v3.set(normal.getX(i), normal.getY(i), normal.getZ(i));
+                v3.setLength(length);
+                position.setXYZ(i, position.getX(i) + v3.x, position.getY(i) + v3.y, position.getZ(i) + v3.z);
+            }
+            position.needsUpdate = true;
+        });
     }
 }

package/MeshBase.ts

@@ -1,19 +1,214 @@
-/*
- * @Author: xiaosihan
- * @Date: 2024-01-29 10:08:40
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2024-02-05 09:40:17
- */
 
-import { Group } from "three";
+import { AnimationAction, AnimationMixer, Clock, DoubleSide, Group, Mesh, MeshStandardMaterial, Object3D, Vector3 } from "three";
+import threeUtils from "./threeUtils";
+import threeLoader from "./threeLoader";
+import * as SkeletonUtils from 'three/examples/jsm/utils/SkeletonUtils';
 
-// 基础模型加载对象
+// 模型基类
 export default class MeshBase extends Group {
-
-    constructor() {
+    constructor(url?: string) {
         super();
+        url && this.loadModel(url);
+    }
+
+    // 模型对象
+    static models: Map<string, Object3D> = new Map();
+
+    // 模型是否在加载中
+    static loadModeling: Map<string, boolean> = new Map();
+
+    // 加载完成
+    loaded = false;
+
+    // 是否有动画
+    hasAnimation = false;
+
+    //动画混合器
+    mixer?: AnimationMixer;
+
+    //动画剪辑对象数组
+    animationActions: { [key: string]: AnimationAction } = {};
+
+    async loadModel(url: string) {
+        if (!url) {
+            this.clear();
+            return;
+        }
+
+        this.loaded = false;
+
+        // 没有模型并且没有加载任务时就去加载模型
+        if (!MeshBase.models.get(url) && !MeshBase.loadModeling.get(url)) {
+            MeshBase.loadModeling.set(url, true);
+
+            let modal = new Object3D();
+
+            if (/\.fbx$/i.test(url)) {
+                await threeLoader.fbxLoader.loadAsync(url).then(res => {
+                    modal = res;
+                }).catch(() => {
+                    console.error(`${url},加载失败`);
+                })
+            } else if (/\.(gltf|glb)$/i.test(url)) {
+                await threeLoader.gltfLoader.loadAsync(url).then(res => {
+                    modal = res.scene;
+                    modal.animations = res.animations;
+                }).catch(() => {
+                    console.error(`${url},加载失败`);
+                })
+            } else {
+                console.error(`${url},不支持的格式`);
+            }
+
+            threeUtils.center(modal);
+            threeUtils.alignBottom(modal);
+            modal.updateMatrixWorld(true);
+
+            MeshBase.models.set(url, modal);
+            MeshBase.loadModeling.set(url, false);
+        }
+
+        // 如果模型还在加载中, 就等待模型加载完成
+        do {
+            await new Promise(resolve => setTimeout(resolve, 50));
+        } while (MeshBase.loadModeling.get(url));
+
+        if (MeshBase.models.get(url)) {
+
+            this.clear();
+            const mesh = MeshBase.models.get(url);
+            // 判断是否有动画
+            this.hasAnimation = mesh.animations.length > 0;
+
+            if (this.hasAnimation) {
+                const model = SkeletonUtils.clone(mesh);
+                this.mixer = new AnimationMixer(model);
+
+                this.animationActions = {};
+                mesh.animations.map(animation => {
+                    const animationAction = this.mixer.clipAction(animation).play();
+                    animationAction.weight = 0;
+                    this.animationActions[animation.name] = animationAction;
+                });
+
+                this.add(model);
+            } else {
+                this.add(mesh);
+            }
+
+        }
+
+        await new Promise(resolve => requestAnimationFrame(resolve));
+
+        // 加载完成事件
+        this.dispatchEvent({ type: "loaded" } as never);
+
+        this.loaded = true;
     }
 
+    // 超出绘制区域时不绘制
+    frustumCulled = false;
 
+    // 创建阴影
+    castShadow: boolean = false;
+
+    // 接受阴影
+    receiveShadow: boolean = false;
+
+    // 等待加载加载完成
+    async awaitLoaded(callback?: Function) {
+        while (!this.loaded) {
+            await new Promise(resolve => setTimeout(resolve, 50));
+        }
+        callback && callback();
+    }
+
+    //遍历模型
+    async traverseMesh(callback: (mesh: Mesh) => void) {
+        // 等待加载完成
+        await this.awaitLoaded();
+
+        this.traverse(obj => {
+            const mesh = obj as Mesh;
+            if (mesh.isMesh) {
+                callback(mesh);
+            }
+        });
+    }
+
+    clock = new Clock();
+
+    //设置动画的权重
+    async setClipActionWeight(weights: { [key: string]: number } = {}) {
+        // 等待加载完成
+        await this.awaitLoaded();
+        for (let key in this.animationActions) {
+            this.animationActions[key].weight = weights[key] || 0;
+        }
+    }
+
+    updateMatrix(): void {
+        //播放动画
+        if (this.mixer) {
+            this.mixer.update(this.clock.getDelta());
+        }
+        // 深度应用属性
+        this.traverse(obj => {
+            const mesh = obj as Mesh;
+            if (mesh.isMesh) {
+                mesh.frustumCulled = this.frustumCulled;
+                mesh.castShadow = this.castShadow;
+                mesh.receiveShadow = this.receiveShadow;
+            }
+        });
+
+        super.updateMatrix();
+    }
+
+    // 获取模型的尺寸
+    async getSize() {
+        await this.awaitLoaded();
+        return threeUtils.getSize(this);
+    }
+
+    // 居中
+    async center() {
+        await this.awaitLoaded();
+        threeUtils.center(this);
+    }
+
+    //底对齐
+    async alignBottom(y: number = 0) {
+        await this.awaitLoaded();
+        threeUtils.alignBottom(this, y);
+    }
+
+    // 放大到指定尺寸
+    async scaleTo(size: number = 1, key: Array<"x" | "y" | "z"> = ["x", "y", "z"]) {
+        await this.awaitLoaded();
+        threeUtils.scaleTo(this, size, key);
+    }
+
+    //按照法线拓展
+    expandBynormal(length: number) {
+        this.traverseMesh(mesh => {
+            // 没有法线就计算法线
+            mesh.geometry = mesh.geometry.clone();
+            if (!mesh.geometry.getAttribute("normal")) {
+                mesh.geometry.computeVertexNormals();
+            }
+
+            const normal = mesh.geometry.getAttribute("normal");
+            const position = mesh.geometry.getAttribute("position");
+            const v3 = new Vector3(0, 0, 0);
+            for (let i = 0; i < position.count; i++) {
+                v3.set(normal.getX(i), normal.getY(i), normal.getZ(i));
+                v3.setLength(length);
+                position.setXYZ(i, position.getX(i) + v3.x, position.getY(i) + v3.y, position.getZ(i) + v3.z);
+            }
+            position.needsUpdate = true;
+
+        })
+    }
 
 }

package/PlaneText.d.ts

@@ -22,15 +22,15 @@ export default class PlaneText extends Mesh {
     spriteText: SpriteText;
     material: MeshBasicMaterial;
     set(parame: Props): void;
-    get(prop: keyof SpriteText): string | number | boolean | Vector3 | import("three").Object3D<import("three").Object3DEventMap> | import("three").BufferGeometry<import("three").NormalBufferAttributes> | ((force?: boolean) => void) | import("three").Object3D<import("three").Object3DEventMap>[] | HTMLCanvasElement | import("three").Vector2 | import("three").Material | Record<string, any> | import("three").Matrix4 | import("three").Quaternion | (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | import("three").Euler | import("three").Matrix3 | import("three").Layers | import("three").AnimationClip[] | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, depthMaterial: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, depthMaterial: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, material: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, material: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((matrix: import("three").Matrix4) => void) | ((axis: Vector3, angle: number) => void) | ((euler: import("three").Euler) => void) | ((m: import("three").Matrix4) => void) | ((q: import("three").Quaternion) => void) | ((vector: Vector3) => Vector3) | ((vector: Vector3) => Vector3) | {
+    get(prop: keyof SpriteText): string | number | boolean | Vector3 | import("three").Object3D<import("three").Object3DEventMap> | import("three").BufferGeometry<import("three").NormalBufferAttributes> | ((force?: boolean) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | import("three").Object3D<import("three").Object3DEventMap>[] | import("three").Euler | import("three").Material | import("three").Quaternion | import("three").Matrix4 | import("three").Matrix3 | import("three").Layers | import("three").AnimationClip[] | Record<string, any> | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, depthMaterial: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, depthMaterial: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, material: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((renderer: import("three").WebGLRenderer, scene: import("three").Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry<import("three").NormalBufferAttributes>, material: import("three").Material, group: import("three").Group<import("three").Object3DEventMap>) => void) | ((matrix: import("three").Matrix4) => void) | ((axis: Vector3, angle: number) => void) | ((euler: import("three").Euler) => void) | ((m: import("three").Matrix4) => void) | ((q: import("three").Quaternion) => void) | ((vector: Vector3) => Vector3) | ((vector: Vector3) => Vector3) | {
         (vector: Vector3): void;
         (x: number, y: number, z: number): void;
-    } | ((id: number) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string, value: any) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string, value: any, optionalTarget?: import("three").Object3D<import("three").Object3DEventMap>[]) => import("three").Object3D<import("three").Object3DEventMap>[]) | ((target: Vector3) => Vector3) | ((target: import("three").Quaternion) => import("three").Quaternion) | ((target: Vector3) => Vector3) | ((target: Vector3) => Vector3) | ((raycaster: import("three").Raycaster, intersects: import("three").Intersection<import("three").Object3D<import("three").Object3DEventMap>>[]) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | (() => void) | ((updateParents: boolean, updateChildren: boolean) => void) | ((meta?: {
+    } | ((id: number) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string, value: any) => import("three").Object3D<import("three").Object3DEventMap>) | ((name: string, value: any, optionalTarget?: import("three").Object3D<import("three").Object3DEventMap>[]) => import("three").Object3D<import("three").Object3DEventMap>[]) | ((target: Vector3) => Vector3) | ((target: import("three").Quaternion) => import("three").Quaternion) | ((target: Vector3) => Vector3) | ((target: Vector3) => Vector3) | ((raycaster: import("three").Raycaster, intersects: import("three").Intersection<import("three").Object3D<import("three").Object3DEventMap>>[]) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | ((callback: (object: import("three").Object3D<import("three").Object3DEventMap>) => any) => void) | (() => void) | ((updateParents: boolean, updateChildren: boolean) => void) | ((meta?: {
         geometries: any;
         materials: any;
         textures: any;
         images: any;
-    }) => any) | import("three").SpriteMaterial | ((source: SpriteText, recursive?: boolean) => SpriteText) | (() => void) | ((quaternion: import("three").Quaternion) => SpriteText) | ((axis: Vector3, angle: number) => SpriteText) | ((axis: Vector3, angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((axis: Vector3, distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((...object: import("three").Object3D<import("three").Object3DEventMap>[]) => SpriteText) | ((...object: import("three").Object3D<import("three").Object3DEventMap>[]) => SpriteText) | (() => SpriteText) | (() => SpriteText) | ((object: import("three").Object3D<import("three").Object3DEventMap>) => SpriteText) | ((recursive?: boolean) => SpriteText) | {
+    }) => any) | (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | HTMLCanvasElement | import("three").Vector2 | import("three").SpriteMaterial | ((source: SpriteText, recursive?: boolean) => SpriteText) | (() => void) | ((quaternion: import("three").Quaternion) => SpriteText) | ((axis: Vector3, angle: number) => SpriteText) | ((axis: Vector3, angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((angle: number) => SpriteText) | ((axis: Vector3, distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((distance: number) => SpriteText) | ((...object: import("three").Object3D<import("three").Object3DEventMap>[]) => SpriteText) | ((...object: import("three").Object3D<import("three").Object3DEventMap>[]) => SpriteText) | (() => SpriteText) | (() => SpriteText) | ((object: import("three").Object3D<import("three").Object3DEventMap>) => SpriteText) | ((recursive?: boolean) => SpriteText) | {
         <T_1 extends keyof import("three").Object3DEventMap>(type: T_1, listener: import("three").EventListener<import("three").Object3DEventMap[T_1], T_1, SpriteText>): void;
         <T_2 extends string>(type: T_2, listener: import("three").EventListener<{}, T_2, SpriteText>): void;
     } | {

package/ThreeBase.js

@@ -187,7 +187,12 @@ export default class ThreeBase extends EventDispatcher {
     frame = 50;
     init() {
         // 资源加载进度有更新时, 需要渲染
-        threeLoader.addEventListener("progress", () => {
+        threeLoader.addEventListener("loadding", () => {
+            this.dispatchEvent({ type: "loadding" });
+            this.needRender = true;
+        });
+        threeLoader.addEventListener("onLoad", () => {
+            this.dispatchEvent({ type: "onLoad" });
             this.needRender = true;
         });
     }
@@ -294,9 +299,7 @@ export default class ThreeBase extends EventDispatcher {
     }
     // 渲染场景
     render() {
-        // 控制器在移动时鼠标不能操作
-        // this.renderer.domElement.style.pointerEvents = (!this.controlsPosition.isDone() || !this.controlsCenter.isDone()) ? "none" : "all";
-        // canvas 没有在页面上面的话 就跳过渲染
+        // canvas 没有在页面上面的话 就停止渲染
         if (!threeUtils.inDocument(this.renderer.domElement)) {
             this.stopRender();
             return;

package/ThreeBase.ts

@@ -227,7 +227,13 @@ export default class ThreeBase extends EventDispatcher {
 
     init() {
         // 资源加载进度有更新时, 需要渲染
-        threeLoader.addEventListener("progress", () => {
+        threeLoader.addEventListener("loadding", () => {
+            this.dispatchEvent({ type: "loadding" } as never);
+            this.needRender = true;
+        });
+        
+        threeLoader.addEventListener("onLoad", () => {
+            this.dispatchEvent({ type: "onLoad" } as never);
             this.needRender = true;
         });
 
@@ -363,10 +369,7 @@ export default class ThreeBase extends EventDispatcher {
 
     // 渲染场景
     render() {
-        // 控制器在移动时鼠标不能操作
-        // this.renderer.domElement.style.pointerEvents = (!this.controlsPosition.isDone() || !this.controlsCenter.isDone()) ? "none" : "all";
-
-        // canvas 没有在页面上面的话 就跳过渲染
+        // canvas 没有在页面上面的话 就停止渲染
         if (!threeUtils.inDocument(this.renderer.domElement)) {
             this.stopRender();
             return;

package/ThreeMouse.js

@@ -232,7 +232,7 @@ export default class ThreeMouse {
             return;
         }
         this._mesh_on = intersection.object;
-        if (this.hasEvent(this._mesh_Down, ["mouseup"])) {
+        if (this.hasEvent(this._mesh_on, ["mouseup"])) {
             this._mesh_on.dispatchEvent({
                 ...intersection,
                 renderer: this._renderer,

package/ThreeMouse.ts

@@ -312,7 +312,7 @@ export default class ThreeMouse {
 
         this._mesh_on = intersection.object as Object3D;
 
-        if (this.hasEvent(this._mesh_Down, ["mouseup"])) {
+        if (this.hasEvent(this._mesh_on, ["mouseup"])) {
 
             this._mesh_on.dispatchEvent({
                 ...intersection,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "three-base",
-    "version": "2.0.26",
+    "version": "2.0.29",
     "description": "three 3d three-base",
     "publishConfig": {
         "registry": "https://registry.npmjs.org/"

package/threeLoader.js

@@ -26,8 +26,13 @@ class ThreeLoader extends EventDispatcher {
             this.onload = false;
         };
         // 有资源加载完成时通知渲染器
-        DefaultLoadingManager.onProgress = () => {
-            this.dispatchEvent({ type: "progress" });
+        DefaultLoadingManager.onProgress = (url, loaded, total) => {
+            if (loaded < total) {
+                this.dispatchEvent({ type: "loadding" });
+            }
+            else if (loaded === total) {
+                this.dispatchEvent({ type: "onLoad" });
+            }
         };
         DefaultLoadingManager.onLoad = () => {
             this.onload = true;

package/threeLoader.ts

@@ -32,8 +32,12 @@ class ThreeLoader extends EventDispatcher {
         }
 
         // 有资源加载完成时通知渲染器
-        DefaultLoadingManager.onProgress = () => {
-            this.dispatchEvent({ type: "progress" } as never);
+        DefaultLoadingManager.onProgress = (url: string, loaded: number, total: number) => {
+            if (loaded < total) {
+                this.dispatchEvent({ type: "loadding" } as never);
+            } else if (loaded === total) {
+                this.dispatchEvent({ type: "onLoad" } as never);
+            }
         }
 
         DefaultLoadingManager.onLoad = () => {

package/threeUtils.d.ts

@@ -36,6 +36,7 @@ declare class ThreeUtils extends EventDispatcher {
     centerObject3D(object3d: Object3D | BufferGeometry): void;
     center(object3d: Object3D | BufferGeometry): void;
     scaleTo(object3d: Object3D | BufferGeometry, size?: number, key?: Array<"x" | "y" | "z">): void;
+    applyAllTranstion(object3d: Object3D): void;
     exportGLB(input: Object3D, fileName?: string): void;
     getVolume(geometry: BufferGeometry): number;
     signedVolumeOfTriangle(p1: Vector3, p2: Vector3, p3: Vector3): number;

package/threeUtils.js

@@ -173,6 +173,19 @@ class ThreeUtils extends EventDispatcher {
             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();

package/threeUtils.ts

@@ -5,7 +5,7 @@
  * @Last Modified time: 2023-05-03 00:36:18
  */
 
-import { Box3, BufferAttribute, BufferGeometry, Clock, EventDispatcher, Object3D, Vector3 } from "three";
+import { Box3, BufferAttribute, BufferGeometry, Clock, EventDispatcher, Mesh, MeshStandardMaterial, Object3D, Vector3 } from "three";
 import { GLTFExporter } from 'three/examples/jsm/exporters/GLTFExporter';
 
 class ThreeUtils extends EventDispatcher {
@@ -200,6 +200,20 @@ class ThreeUtils extends EventDispatcher {
         }
     }
 
+    // 应用全部变化
+    applyAllTranstion(object3d: 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 as Mesh).isMesh) {
+                (obj as Mesh).geometry.applyMatrix4(obj.matrixWorld);
+            }
+        });
+    }
+
     // 导出 glb
     exportGLB(input: Object3D, fileName: string = "threeUtils.exportGLB") {
         const gltfExporter = new GLTFExporter();