three-base 2.0.84 → 2.0.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/PlaneText.d.ts +2 -2
  2. package/README.md +2 -3
  3. package/package.json +46 -45
  4. package/threeLoader.d.ts +6 -2
  5. package/threeLoader.js +226 -65
  6. package/threeLoader.ts +390 -174
  7. package/threeUtils.d.ts +2 -0
  8. package/threeUtils.js +32 -20
  9. package/threeUtils.ts +324 -280
package/PlaneText.d.ts CHANGED
@@ -25,7 +25,7 @@ export default class PlaneText extends Mesh {
25
25
  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) | {
26
26
  (vector: Vector3): void;
27
27
  (x: number, y: number, z: number): void;
28
- } | ((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?: import("three").JSONMeta) => import("three").Object3DJSON) | (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | HTMLCanvasElement | import("three").Vector2 | import("three").SpriteMaterial | ((object: import("three").Object3D<import("three").Object3DEventMap>, 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) | {
28
+ } | ((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?: import("three").JSONMeta) => import("three").Object3DJSON) | (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | HTMLCanvasElement | import("three").Vector2 | import("three").SpriteMaterial | ((object: import("three").Object3D<import("three").Object3DEventMap>, recursive?: boolean) => SpriteText) | ((recursive?: boolean) => SpriteText) | {
29
29
  <T_1 extends keyof import("three").Object3DEventMap>(type: T_1, listener: import("three").EventListener<import("three").Object3DEventMap[T_1], T_1, SpriteText>): void;
30
30
  <T_2 extends string>(type: T_2, listener: import("three").EventListener<{}, T_2, SpriteText>): void;
31
31
  } | {
@@ -34,6 +34,6 @@ export default class PlaneText extends Mesh {
34
34
  } | {
35
35
  <T_5 extends keyof import("three").Object3DEventMap>(type: T_5, listener: import("three").EventListener<import("three").Object3DEventMap[T_5], T_5, SpriteText>): void;
36
36
  <T_6 extends string>(type: T_6, listener: import("three").EventListener<{}, T_6, SpriteText>): void;
37
- };
37
+ } | (() => 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);
38
38
  }
39
39
  export {};
package/README.md CHANGED
@@ -4,6 +4,7 @@
4
4
  import { AmbientLight, BoxGeometry, Mesh, MeshLambertMaterial, PointLight } from "three";
5
5
  import ThreeBase from "three-base";
6
6
  import Transition from "three-base/Transition";
7
+ import Fire from "three-base/Fire";
7
8
 
8
9
  //qq389652405
9
10
  class HomeRender extends ThreeBase {
@@ -102,8 +103,6 @@ homeRenderer.setContainer( document.getElementById("div") );
102
103
 
103
104
  ```
104
105
 
105
- 演示地址: https://drm.gitee.io/vite_react_mobx_threebase/
106
+ 请尽量使用 vite 来打包
106
107
 
107
108
  代码: https://gitee.com/drm/vite_react_mobx_threebase
108
-
109
- ![demo.png](https://drm.gitee.io/vite_react_mobx_threebase/demo.png)
package/package.json CHANGED
@@ -1,47 +1,48 @@
1
1
  {
2
- "name": "three-base",
3
- "version": "2.0.84",
4
- "description": "three 3d three-base",
5
- "publishConfig": {
6
- "registry": "https://registry.npmjs.org/"
7
- },
8
- "repository": {
9
- "type": "git",
10
- "url": "https://gitee.com/drm/three-base"
11
- },
12
- "keywords": [
13
- "three",
14
- "3d",
15
- "three-base"
16
- ],
17
- "main": "index.js",
18
- "module": "index.js",
19
- "types": "",
20
- "files": [
21
- "/**/*.ts",
22
- "/**/*.js",
23
- "/**/*.tsx",
24
- "/**/*.css",
25
- "/**/*.jpg",
26
- "/**/*.png",
27
- "/**/*.jpeg",
28
- "/**/*.svg",
29
- "/**/*.obj",
30
- "/**/*.gltf",
31
- "/**/*.fbx",
32
- "/**/*.glb",
33
- "/**/*.json",
34
- "/**/*.wasm"
35
- ],
36
- "license": "ISC",
37
- "devDependencies": {},
38
- "dependencies": {
39
- "apng-js": "^1",
40
- "lodash": "^4",
41
- "@types/three": "0.167.0",
42
- "three": "0.167.0",
43
- "dexie": "^3",
44
- "vite": "*",
45
- "html2canvas": "^1.4.1"
46
- }
2
+ "name": "three-base",
3
+ "version": "2.0.86",
4
+ "description": "three 3d three-base",
5
+ "publishConfig": {
6
+ "registry": "https://registry.npmjs.org/"
7
+ },
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "https://gitee.com/drm/three-base"
11
+ },
12
+ "keywords": [
13
+ "three",
14
+ "3d",
15
+ "three-base"
16
+ ],
17
+ "main": "index.js",
18
+ "module": "index.js",
19
+ "types": "",
20
+ "files": [
21
+ "/**/*.ts",
22
+ "/**/*.js",
23
+ "/**/*.tsx",
24
+ "/**/*.css",
25
+ "/**/*.jpg",
26
+ "/**/*.png",
27
+ "/**/*.jpeg",
28
+ "/**/*.svg",
29
+ "/**/*.obj",
30
+ "/**/*.gltf",
31
+ "/**/*.fbx",
32
+ "/**/*.glb",
33
+ "/**/*.json",
34
+ "/**/*.wasm"
35
+ ],
36
+ "license": "ISC",
37
+ "devDependencies": {},
38
+ "dependencies": {
39
+ "apng-js": "^1",
40
+ "lodash": "^4",
41
+ "@types/three": "0.167.0",
42
+ "three": "0.167.0",
43
+ "dexie": "^3",
44
+ "vite": "*",
45
+ "jszip": "^3.10.1",
46
+ "html2canvas": "^1.4.1"
47
+ }
47
48
  }
package/threeLoader.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { EventDispatcher, Object3D, Texture, TextureLoader } from "three";
1
+ import { EventDispatcher, Material, Texture, TextureLoader } from "three";
2
2
  import { FBXLoader } from "three/examples/jsm/loaders/FBXLoader";
3
3
  import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
4
4
  import { MTLLoader } from "three/examples/jsm/loaders/MTLLoader";
@@ -12,14 +12,18 @@ declare class ThreeLoader extends EventDispatcher {
12
12
  textureMap: Map<string, Texture>;
13
13
  textureLoader: TextureLoader;
14
14
  getTexture(src: string | HTMLCanvasElement): Texture;
15
+ _blobs: {
16
+ [key: string]: string;
17
+ };
15
18
  fbxLoader: FBXLoader;
16
19
  objLoader: OBJLoader;
17
20
  stlLoader: STLLoader;
18
21
  mtlLoader: MTLLoader;
19
22
  gltfLoader: GLTFLoader;
20
23
  usdzLoader: USDZLoader;
24
+ setFlipYIsFalse<T extends Material | Material[]>(material: T): void;
21
25
  /** 加载模型支持glb,fbx,stl,obj */
22
- loadModel(url: string, filename?: string): Promise<Object3D<import("three").Object3DEventMap>>;
26
+ loadModel(url: string, filename?: string): any;
23
27
  onload: boolean;
24
28
  }
25
29
  declare const threeLoader: ThreeLoader;
package/threeLoader.js CHANGED
@@ -4,12 +4,12 @@
4
4
  * @Last Modified by: xiaosihan
5
5
  * @Last Modified time: 2023-02-07 11:11:48
6
6
  */
7
- import { CanvasTexture, DefaultLoadingManager, EventDispatcher, Mesh, MeshStandardMaterial, Object3D, RepeatWrapping, TextureLoader, VideoTexture } from "three";
7
+ import { CanvasTexture, DefaultLoadingManager, EventDispatcher, Mesh, MeshStandardMaterial, RepeatWrapping, TextureLoader, VideoTexture, } from "three";
8
+ import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
8
9
  import { FBXLoader } from "three/examples/jsm/loaders/FBXLoader";
9
10
  import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
10
11
  import { MTLLoader } from "three/examples/jsm/loaders/MTLLoader";
11
12
  import { OBJLoader } from "three/examples/jsm/loaders/OBJLoader";
12
- import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
13
13
  import { STLLoader } from "three/examples/jsm/loaders/STLLoader";
14
14
  import { USDZLoader } from "three/examples/jsm/loaders/USDZLoader";
15
15
  // import { IFCLoader } from 'web-ifc-three/dist/IFCLoader';
@@ -21,8 +21,9 @@ import dracoWasmWrapperJS from "./lib/draco/draco_wasm_wrapper.js?url";
21
21
  //@ts-ignore
22
22
  import dracoDecoderJS from "./lib/draco/draco_decoder.js?url";
23
23
  //@ts-ignore
24
+ import axios from "axios";
24
25
  import dracoDecoderWASM from "./lib/draco/draco_decoder.wasm?url";
25
- import { get } from "lodash";
26
+ import threeUtils from "./threeUtils";
26
27
  // 加载器
27
28
  class ThreeLoader extends EventDispatcher {
28
29
  constructor() {
@@ -42,6 +43,19 @@ class ThreeLoader extends EventDispatcher {
42
43
  DefaultLoadingManager.onLoad = () => {
43
44
  this.onload = true;
44
45
  };
46
+ // 资源替换
47
+ DefaultLoadingManager.setURLModifier((url) => {
48
+ const filename = url
49
+ .replace(`blob:${location.origin}/`, "")
50
+ .replace(/^\.\//, "");
51
+ let new_url = this._blobs[filename] || url;
52
+ //如果全匹配没有匹配到资源,就尝试文件名匹配
53
+ if (!this._blobs[filename]) {
54
+ const blobKey = Object.keys(this._blobs).find((key) => new RegExp(`${key}$`).test(filename)) || "";
55
+ new_url = this._blobs[blobKey] || url;
56
+ }
57
+ return new_url;
58
+ });
45
59
  }
46
60
  // 各向异性
47
61
  anisotropy = 16;
@@ -49,7 +63,6 @@ class ThreeLoader extends EventDispatcher {
49
63
  setAnisotropy(v) {
50
64
  this.anisotropy = v;
51
65
  }
52
- ;
53
66
  // 纹理对向缓存
54
67
  textureMap = new Map();
55
68
  // 纹理加载器
@@ -86,7 +99,7 @@ class ThreeLoader extends EventDispatcher {
86
99
  texture = new VideoTexture(videoDom);
87
100
  }
88
101
  else {
89
- texture = this.textureLoader.load(src, tex => {
102
+ texture = this.textureLoader.load(src, (tex) => {
90
103
  tex.image.crossOrigin = "anonymous";
91
104
  });
92
105
  }
@@ -97,7 +110,8 @@ class ThreeLoader extends EventDispatcher {
97
110
  // texture.colorSpace = SRGBColorSpace;
98
111
  return texture;
99
112
  }
100
- ;
113
+ // 资源列表
114
+ _blobs = {};
101
115
  // fbx模型加载器
102
116
  fbxLoader = new FBXLoader();
103
117
  //obj 加载器
@@ -109,84 +123,231 @@ class ThreeLoader extends EventDispatcher {
109
123
  // gltf 加载器
110
124
  gltfLoader = (() => {
111
125
  const loader = new GLTFLoader();
112
- const dracoLoader = new class ThreeBaseDRACOLoader extends DRACOLoader {
126
+ const dracoLoader = new (class ThreeBaseDRACOLoader extends DRACOLoader {
113
127
  _loadLibrary(url, responseType) {
114
128
  //@ts-ignore
115
- let urlConf = (process.env.NODE_ENV === "development") ? {
116
- "draco_decoder.js": "draco_decoder.js",
117
- "draco_wasm_wrapper.js": "draco_wasm_wrapper.js",
118
- "draco_decoder.wasm": "draco_decoder.wasm"
119
- } : {
120
- "draco_decoder.js": dracoWasmWrapperJS,
121
- "draco_wasm_wrapper.js": dracoDecoderJS,
122
- "draco_decoder.wasm": dracoDecoderWASM
123
- };
129
+ let urlConf = process.env.NODE_ENV === "development"
130
+ ? {
131
+ "draco_decoder.js": "draco_decoder.js",
132
+ "draco_wasm_wrapper.js": "draco_wasm_wrapper.js",
133
+ "draco_decoder.wasm": "draco_decoder.wasm",
134
+ }
135
+ : {
136
+ "draco_decoder.js": dracoWasmWrapperJS,
137
+ "draco_wasm_wrapper.js": dracoDecoderJS,
138
+ "draco_decoder.wasm": dracoDecoderWASM,
139
+ };
124
140
  //@ts-ignore
125
141
  return super._loadLibrary(urlConf[url], responseType);
126
142
  }
127
- }();
143
+ })();
128
144
  //@ts-ignore
129
- dracoLoader.setDecoderPath((process.env.NODE_ENV === "development") ? '/node_modules/three/examples/jsm/libs/draco/' : '');
145
+ dracoLoader.setDecoderPath(process.env.NODE_ENV === "development"
146
+ ? "/node_modules/three/examples/jsm/libs/draco/"
147
+ : "");
130
148
  loader.setDRACOLoader(dracoLoader);
131
149
  return loader;
132
150
  })();
133
151
  //usdz加载器
134
152
  usdzLoader = new USDZLoader();
135
- /** 加载模型支持glb,fbx,stl,obj */
136
- async loadModel(url, filename = "") {
137
- // 获取后缀
138
- const suffix = (get((filename || url).match(/\.([^\.]+)$/), [1]) || "").toLowerCase();
139
- let Object3d = new Object3D();
140
- if (["fbx"].includes(suffix)) {
141
- await threeLoader.fbxLoader.loadAsync(url).then(res => {
142
- Object3d = res;
143
- }).catch(() => {
144
- console.error(`${url},加载失败`);
145
- });
153
+ //把贴图的 flipy 设置为 fasle
154
+ setFlipYIsFalse(material) {
155
+ if (material instanceof Array) {
156
+ material.map((m) => this.setFlipYIsFalse(m));
146
157
  }
147
- else if (["gltf", "glb"].includes(suffix)) {
148
- await threeLoader.gltfLoader.loadAsync(url).then(res => {
149
- Object3d = res.scene;
150
- Object3d.animations = res.animations;
151
- }).catch(() => {
152
- console.error(`${url},加载失败`);
153
- });
154
- }
155
- else if (["stl"].includes(suffix)) {
156
- await threeLoader.stlLoader.loadAsync(url).then(geometry => {
157
- Object3d = new Mesh(geometry, new MeshStandardMaterial({
158
- color: "#eeeeee",
159
- metalness: 0,
160
- roughness: 0.5,
161
- envMapIntensity: 0.4
162
- }));
163
- }).catch(() => {
164
- console.error(`${url},加载失败`);
158
+ else {
159
+ const m = material;
160
+ const parame = [
161
+ "map",
162
+ "lightMap",
163
+ "aoMap",
164
+ "emissiveMap",
165
+ "bumpMap",
166
+ "normalMap",
167
+ "displacementMap",
168
+ "alphaMap",
169
+ "envMap",
170
+ ];
171
+ parame.map((param) => {
172
+ const t = m[param];
173
+ if (t) {
174
+ t.flipY = false;
175
+ }
165
176
  });
166
177
  }
167
- else if (["usdz"].includes(suffix)) {
168
- await threeLoader.usdzLoader.loadAsync(url).then(res => {
169
- Object3d = res; // usdz 目前还不支持骨骼动画
170
- Object3d.animations = res.animations;
171
- Object3d.traverse(obj => {
178
+ }
179
+ /** 加载模型支持glb,fbx,stl,obj */
180
+ async loadModel(url, filename = "") {
181
+ // 获取后缀
182
+ const suffix = threeUtils.getSuffix(filename || url);
183
+ switch (suffix) {
184
+ case "zip":
185
+ const JSZip = (await import("jszip")).default;
186
+ const arrayBuffer = await axios
187
+ .get(url, {
188
+ responseType: "arraybuffer",
189
+ })
190
+ .then((res) => res.data)
191
+ .catch((err) => {
192
+ throw new Error(`${url} 加载失败`);
193
+ });
194
+ return await JSZip.loadAsync(arrayBuffer).then(async (zip) => {
195
+ for (let filename in zip.files) {
196
+ if (!zip.files[filename].dir) {
197
+ // 不读文件夹
198
+ await zip
199
+ .file(filename)
200
+ .async("blob")
201
+ .then((blob) => {
202
+ var blobURL = URL.createObjectURL(blob);
203
+ this._blobs[filename] = blobURL;
204
+ });
205
+ }
206
+ }
207
+ let objLoader = new OBJLoader();
208
+ // 如果有mtl文件就加载mtl文件
209
+ let mtl = Object.keys(zip.files).find((filename) => /\.mtl$/.test(filename));
210
+ if (mtl) {
211
+ const materials = await this.mtlLoader.loadAsync(mtl);
212
+ objLoader.setMaterials(materials);
213
+ }
214
+ else {
215
+ //@ts-ignore
216
+ objLoader.materials = null;
217
+ }
218
+ //如果有obj就加载obj模型
219
+ let obj = Object.keys(zip.files).find((filename) => /\.obj$/.test(filename));
220
+ if (obj) {
221
+ const objObject3d = await objLoader.loadAsync(obj);
222
+ objObject3d.traverse((obj) => {
223
+ const mesh = obj;
224
+ if (mesh.isMesh) {
225
+ // 如果obj没有材质就给默认的材质
226
+ if (!objLoader.materials) {
227
+ mesh.material = new MeshStandardMaterial({
228
+ metalness: 0.5,
229
+ roughness: 0.5,
230
+ });
231
+ }
232
+ const uv = mesh.geometry.getAttribute("uv");
233
+ if (uv) {
234
+ for (let i = 0; i < uv.count; i++) {
235
+ uv.setY(i, 1 - uv.getY(i));
236
+ }
237
+ }
238
+ // obj只翻转uv不翻转贴图
239
+ this.setFlipYIsFalse(mesh.material);
240
+ }
241
+ });
242
+ return objObject3d;
243
+ }
244
+ //如果有gltf文件就加载gltf文件
245
+ let gltf = Object.keys(zip.files).find((filename) => /\.(gltf|glb)$/.test(filename));
246
+ if (gltf) {
247
+ return await this.loadModel(gltf);
248
+ }
249
+ //如果有dae文件就加载dae文件
250
+ let dae = Object.keys(zip.files).find((filename) => /\.dae$/.test(filename));
251
+ if (dae) {
252
+ return await this.loadModel(dae);
253
+ }
254
+ //如果有fbx文件就加载fbx文件
255
+ let fbx = Object.keys(zip.files).find((filename) => /\.fbx$/.test(filename));
256
+ if (fbx) {
257
+ return await this.loadModel(fbx);
258
+ }
259
+ //如果有usdz文件就加载usdz文件
260
+ let usdz = Object.keys(zip.files).find((filename) => /\.usdz$/.test(filename));
261
+ if (usdz) {
262
+ return await this.loadModel(usdz);
263
+ }
264
+ //如果有stl文件就加载stl文件
265
+ let stl = Object.keys(zip.files).find((filename) => /\.stl$/.test(filename));
266
+ if (stl) {
267
+ return await this.loadModel(stl);
268
+ }
269
+ if ([obj, gltf, dae, fbx, usdz, stl].every((v) => !v)) {
270
+ throw new Error(`${url}压缩包里没有obj.glb.gltf.dae.fbx.usde.stl等模型文件`);
271
+ }
272
+ });
273
+ case "fbx":
274
+ return await threeLoader.fbxLoader
275
+ .loadAsync(url)
276
+ .then((res) => {
277
+ return res;
278
+ })
279
+ .catch(() => {
280
+ console.log(`${url},加载失败`);
281
+ });
282
+ case "gltf":
283
+ case "glb":
284
+ return await threeLoader.gltfLoader
285
+ .loadAsync(url)
286
+ .then((res) => {
287
+ res.scene.animations = res.animations;
288
+ return res.scene;
289
+ })
290
+ .catch(() => {
291
+ console.log(`${url},加载失败`);
292
+ });
293
+ case "stl":
294
+ return await threeLoader.stlLoader
295
+ .loadAsync(url)
296
+ .then((geometry) => {
297
+ return new Mesh(geometry, new MeshStandardMaterial({
298
+ metalness: 0.5,
299
+ roughness: 0.5,
300
+ }));
301
+ })
302
+ .catch(() => {
303
+ console.log(`${url},加载失败`);
304
+ });
305
+ case "usdz":
306
+ return await threeLoader.usdzLoader
307
+ .loadAsync(url)
308
+ .then((res) => {
309
+ res.traverse((obj) => {
310
+ const mesh = obj;
311
+ if (mesh.isMesh) {
312
+ mesh.material.transparent = true;
313
+ }
314
+ });
315
+ return res;
316
+ })
317
+ .catch((err) => {
318
+ console.log(`${url},加载失败`, err);
319
+ });
320
+ case "obj":
321
+ const objObject3d = await this.objLoader.loadAsync(url);
322
+ objObject3d.traverse((obj) => {
172
323
  const mesh = obj;
173
324
  if (mesh.isMesh) {
174
- mesh.material.transparent = true;
325
+ // 如果obj没有材质就给默认的材质
326
+ if (!this.objLoader.materials) {
327
+ mesh.material = new MeshStandardMaterial({
328
+ metalness: 0.5,
329
+ roughness: 0.5,
330
+ });
331
+ }
332
+ const uv = mesh.geometry.getAttribute("uv");
333
+ if (uv) {
334
+ for (let i = 0; i < uv.count; i++) {
335
+ uv.setY(i, 1 - uv.getY(i));
336
+ }
337
+ }
338
+ // obj只翻转uv不翻转贴图
339
+ this.setFlipYIsFalse(mesh.material);
175
340
  }
176
341
  });
177
- }).catch((err) => {
178
- console.error(`${url},加载失败`, err);
179
- });
180
- }
181
- else {
182
- if (suffix) {
183
- console.error(`${suffix},不支持的格式`);
184
- }
185
- else {
186
- console.error(`${url},不支持的格式,请尝试使用 suffix 参数来指定一下格式`);
187
- }
342
+ return objObject3d;
343
+ default:
344
+ if (suffix) {
345
+ console.log(`${suffix},不支持的格式`);
346
+ }
347
+ else {
348
+ console.log(`${url},不支持的格式,请尝试使用 suffix 参数来指定一下格式`);
349
+ }
188
350
  }
189
- return Object3d;
190
351
  }
191
352
  // 是否加载完成
192
353
  onload = true;