three-base 2.0.73 → 2.0.74

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 (83) hide show
  1. package/ApngTexture.d.ts +13 -13
  2. package/ApngTexture.js +61 -61
  3. package/ApngTextureManage.d.ts +18 -18
  4. package/ApngTextureManage.js +87 -87
  5. package/EventMesh.d.ts +18 -18
  6. package/EventMesh.js +59 -59
  7. package/ExtrudeMesh.d.ts +111 -111
  8. package/ExtrudeMesh.js +363 -363
  9. package/FPScontrol.d.ts +45 -45
  10. package/FPScontrol.js +171 -171
  11. package/Fire/Fire.d.ts +28 -28
  12. package/Fire/Fire.js +79 -79
  13. package/Fire/FireGromtry.d.ts +9 -9
  14. package/Fire/FireGromtry.js +40 -40
  15. package/Fire/FireMaterial.d.ts +28 -28
  16. package/Fire/FireMaterial.js +32 -32
  17. package/InstancedMeshBase.d.ts +32 -32
  18. package/InstancedMeshBase.js +236 -223
  19. package/InstancedMeshBase.ts +24 -13
  20. package/KeyFrameAnimation.d.ts +25 -25
  21. package/KeyFrameAnimation.js +78 -78
  22. package/MeshBase.d.ts +34 -33
  23. package/MeshBase.js +185 -174
  24. package/MeshBase.ts +16 -5
  25. package/Mirror.d.ts +25 -25
  26. package/Mirror.js +139 -139
  27. package/PlaneModal1/PlaneModal1.d.ts +31 -31
  28. package/PlaneModal1/PlaneModal1.js +105 -105
  29. package/PlaneModal1/index.d.ts +1 -1
  30. package/PlaneModal1/index.js +1 -1
  31. package/PlaneText.d.ts +44 -44
  32. package/PlaneText.js +30 -30
  33. package/PlaneWithHtml.d.ts +11 -11
  34. package/PlaneWithHtml.js +68 -68
  35. package/PointLight/PointLight.d.ts +13 -13
  36. package/PointLight/PointLight.js +64 -64
  37. package/PointLight/index.d.ts +1 -1
  38. package/PointLight/index.js +1 -1
  39. package/Sky/Sky.d.ts +13 -13
  40. package/Sky/Sky.js +28 -28
  41. package/Sky/index.d.ts +1 -1
  42. package/Sky/index.js +1 -1
  43. package/SpriteModal1/SpriteModal1.d.ts +30 -30
  44. package/SpriteModal1/SpriteModal1.js +110 -110
  45. package/SpriteModal1/index.d.ts +1 -1
  46. package/SpriteModal1/index.js +1 -1
  47. package/SpriteText.d.ts +45 -45
  48. package/SpriteText.js +163 -163
  49. package/SpriteText2.d.ts +47 -47
  50. package/SpriteText2.js +198 -198
  51. package/SpriteWithHtml.d.ts +7 -7
  52. package/SpriteWithHtml.js +49 -49
  53. package/Text3D/Text3D.d.ts +20 -20
  54. package/Text3D/Text3D.js +62 -62
  55. package/Text3D/fontController.d.ts +59 -59
  56. package/Text3D/fontController.js +200 -200
  57. package/Text3D/index.d.ts +1 -1
  58. package/Text3D/index.js +1 -1
  59. package/ThreeBase.d.ts +92 -92
  60. package/ThreeBase.js +619 -619
  61. package/ThreeMouse.d.ts +39 -39
  62. package/ThreeMouse.js +359 -359
  63. package/Transition.d.ts +40 -40
  64. package/Transition.js +207 -207
  65. package/index.d.ts +1 -1
  66. package/index.js +2 -2
  67. package/keyContorls.d.ts +25 -25
  68. package/keyContorls.js +98 -98
  69. package/package.json +1 -1
  70. package/pass/FullScreenQuad.d.ts +7 -7
  71. package/pass/FullScreenQuad.js +25 -25
  72. package/pass/glow_pass.d.ts +2 -2
  73. package/pass/glow_pass.js +236 -236
  74. package/pass/stroke_pass.d.ts +2 -2
  75. package/pass/stroke_pass.js +202 -202
  76. package/shaders/FXAAShaderMaterial.d.ts +3 -3
  77. package/shaders/FXAAShaderMaterial.js +21 -21
  78. package/shaders.d.ts +17 -17
  79. package/shaders.js +99 -99
  80. package/threeLoader.d.ts +26 -26
  81. package/threeLoader.js +189 -189
  82. package/threeUtils.d.ts +47 -47
  83. package/threeUtils.js +266 -266
@@ -1,223 +1,236 @@
1
- /*
2
- * @Author: xiaosihan
3
- * @Date: 2024-02-05 09:31:57
4
- * @Last Modified by: xiaosihan
5
- * @Last Modified time: 2024-06-07 22:14:53
6
- */
7
- import { throttle } from "lodash";
8
- import { Euler, InstancedBufferAttribute, InstancedMesh, Matrix4, Quaternion, Vector3 } from "three";
9
- import MeshBase from "./MeshBase";
10
- import threeUtils from "./threeUtils";
11
- import threeLoader from "./threeLoader";
12
- // 实例模型组对象
13
- export default class InstancedMeshBase extends MeshBase {
14
- constructor(url) {
15
- super(url);
16
- }
17
- isInstancedGroupMesh = true;
18
- count = 0;
19
- size = new Vector3(1, 1, 1);
20
- meshCollect = {};
21
- instanceCollect = {};
22
- colorMap = new Map();
23
- static _position = new Vector3();
24
- static _scale = new Vector3(1, 1, 1);
25
- static _rotation = new Euler();
26
- static _Quaternion = new Quaternion();
27
- static _matrix = new Matrix4();
28
- instanceMatrix = new InstancedBufferAttribute(new Float32Array(0 * 16), 16);
29
- instanceColor = new InstancedBufferAttribute(new Float32Array(0 * 3), 3);
30
- // 重构加载模型的方法
31
- async loadModel(url, filename = "") {
32
- this.url = url;
33
- if (!url) {
34
- this.clear();
35
- return;
36
- }
37
- this.loaded = false;
38
- // 没有模型并且没有加载任务时就去加载模型
39
- if (!MeshBase.models.get(url) && !MeshBase.loadModeling.get(url)) {
40
- MeshBase.loadModeling.set(url, true);
41
- // 万能加载器
42
- let modal = await threeLoader.loadModel(url, filename);
43
- threeUtils.center(modal);
44
- modal.updateMatrixWorld(true);
45
- MeshBase.models.set(url, modal);
46
- MeshBase.loadModeling.set(url, false);
47
- }
48
- // 如果模型还在加载中, 就等待模型加载完成
49
- do {
50
- await new Promise(resolve => setTimeout(resolve, 50));
51
- } while (MeshBase.loadModeling.get(url));
52
- if (MeshBase.models.get(url)) {
53
- this.clear();
54
- const mesh = MeshBase.models.get(url);
55
- // // 判断是否有动画
56
- // this.hasAnimation = mesh.animations.length > 0;
57
- // if (this.hasAnimation) {
58
- // const model = SkeletonUtils.clone(mesh);
59
- // this.mixer = new AnimationMixer(model);
60
- // this.animationActions = {};
61
- // mesh.animations.map(animation => {
62
- // const animationAction = this.mixer!.clipAction(animation).play();
63
- // animationAction.weight = 0;
64
- // this.animationActions[animation.name] = animationAction;
65
- // });
66
- // this.add(model);
67
- // } else {
68
- // this.add(mesh.clone(true));
69
- // }
70
- this.size.copy(threeUtils.getSize(mesh));
71
- const { meshCollect, instanceCollect } = this;
72
- mesh.updateMatrixWorld(true);
73
- // collect all mesh counts, in case there are more than one copy of the same mesh in this group
74
- mesh.traverse((obj) => {
75
- const mesh = obj;
76
- if (mesh.isMesh) {
77
- mesh.matrixWorld.decompose(mesh.position, mesh.quaternion, mesh.scale);
78
- mesh.rotation.setFromQuaternion(mesh.quaternion);
79
- mesh.updateMatrix();
80
- // same geometry and same material consider as the same mesh
81
- const uuid = mesh.geometry.uuid + '/' + mesh.material.uuid;
82
- if (meshCollect[uuid]) {
83
- meshCollect[uuid].push(mesh);
84
- }
85
- else {
86
- meshCollect[uuid] = [mesh];
87
- }
88
- }
89
- else {
90
- obj.position.set(0, 0, 0);
91
- obj.scale.set(1, 1, 1);
92
- obj.rotation.set(0, 0, 0);
93
- }
94
- });
95
- // create all instances
96
- Object.keys(meshCollect).forEach(uuid => {
97
- const meshes = meshCollect[uuid];
98
- const mesh = meshes[0];
99
- const instancedMesh = new InstancedMesh(mesh.geometry, mesh.material, meshes.length * this.count);
100
- instancedMesh.name = mesh.name;
101
- instancedMesh.frustumCulled = false;
102
- instanceCollect[uuid] = instancedMesh;
103
- this.add(instancedMesh);
104
- });
105
- // 加载完成事件
106
- await new Promise(resolve => setTimeout(resolve, 100));
107
- // 加载完成事件
108
- this.dispatchEvent({ type: "loaded" });
109
- this.loaded = true;
110
- }
111
- }
112
- // 更新包围盒
113
- computeBoundingSphere = throttle(() => {
114
- this.children.map(instancedMesh => {
115
- instancedMesh.computeBoundingSphere();
116
- });
117
- }, 1000);
118
- //初始实例矩阵的数量
119
- async setCount(count = 0) {
120
- await this.awaitLoaded();
121
- const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
122
- const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
123
- for (let i = 0; i < count; i++) {
124
- instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i);
125
- instanceColor.set([1, 1, 1], i);
126
- }
127
- for (let i = 0; i < this.count; i++) {
128
- instanceMatrix.copyAt(i, this.instanceMatrix, i);
129
- instanceColor.copyAt(i, this.instanceColor, i);
130
- }
131
- this.instanceMatrix = instanceMatrix;
132
- this.instanceColor = instanceColor;
133
- this.count = count;
134
- this.children.map((instanceMesh) => {
135
- const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
136
- const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
137
- for (let i = 0; i < instanceMesh.count; i++) {
138
- instanceMatrix.copyAt(i, this.instanceMatrix, i);
139
- instanceColor.copyAt(i, this.instanceColor, i);
140
- }
141
- instanceMesh.instanceMatrix = instanceMatrix;
142
- instanceMesh.instanceColor = instanceColor;
143
- instanceMesh.count = count;
144
- });
145
- }
146
- // 设置矩阵
147
- async setMatrixAt(index, matrix) {
148
- await this.awaitLoaded();
149
- Object.keys(this.meshCollect).forEach(uuid => {
150
- const instancedMesh = this.instanceCollect[uuid];
151
- const collect = this.meshCollect[uuid];
152
- collect.forEach((mesh, i) => {
153
- InstancedMeshBase._matrix.copy(mesh.matrix);
154
- InstancedMeshBase._matrix.premultiply(matrix);
155
- instancedMesh.setMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
156
- instancedMesh.instanceMatrix.needsUpdate = true;
157
- });
158
- });
159
- this.computeBoundingSphere();
160
- }
161
- //设置移动旋转缩放
162
- async setTRS(index, { position = InstancedMeshBase._position, rotation = InstancedMeshBase._rotation, scale = InstancedMeshBase._scale }) {
163
- await this.awaitLoaded();
164
- Object.keys(this.meshCollect).forEach(uuid => {
165
- const instancedMesh = this.instanceCollect[uuid];
166
- const collect = this.meshCollect[uuid];
167
- collect.forEach((mesh, i) => {
168
- //获取对应的模型的矩阵
169
- instancedMesh.getMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
170
- InstancedMeshBase._matrix.premultiply(mesh.matrix.clone().invert());
171
- InstancedMeshBase._matrix.decompose(InstancedMeshBase._position, InstancedMeshBase._Quaternion, InstancedMeshBase._scale);
172
- InstancedMeshBase._rotation.setFromQuaternion(InstancedMeshBase._Quaternion);
173
- InstancedMeshBase._position.copy(position);
174
- InstancedMeshBase._rotation.copy(rotation);
175
- InstancedMeshBase._scale.copy(scale);
176
- InstancedMeshBase._Quaternion.setFromEuler(InstancedMeshBase._rotation);
177
- InstancedMeshBase._matrix.compose(InstancedMeshBase._position, InstancedMeshBase._Quaternion, InstancedMeshBase._scale);
178
- InstancedMeshBase._matrix.premultiply(mesh.matrix);
179
- instancedMesh.setMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
180
- instancedMesh.instanceMatrix.needsUpdate = true;
181
- });
182
- });
183
- this.computeBoundingSphere();
184
- }
185
- // 设置颜色
186
- async setColorAt(index, color) {
187
- await this.awaitLoaded();
188
- Object.keys(this.meshCollect).forEach(uuid => {
189
- const instancedMesh = this.instanceCollect[uuid];
190
- const collect = this.meshCollect[uuid];
191
- collect.forEach((mesh, i) => {
192
- const c = color(instancedMesh);
193
- if (c) {
194
- instancedMesh.setColorAt(collect.length * index + i, c);
195
- instancedMesh.instanceColor.needsUpdate = true;
196
- }
197
- });
198
- });
199
- }
200
- // 同步属性
201
- updateMatrixWorld(force) {
202
- super.updateMatrixWorld(force);
203
- const { cursor, enableEvent } = this.userData;
204
- this.traverse(obj => {
205
- Object.assign(obj.userData, { cursor, enableEvent });
206
- });
207
- }
208
- // 事件监听
209
- async addEventListener(name, callback) {
210
- await this.awaitLoaded();
211
- super.addEventListener(name, callback);
212
- this.children.map(mesh => {
213
- mesh.addEventListener(name, callback);
214
- });
215
- }
216
- // 取消事件的监听
217
- removeEventListener(name, callback) {
218
- super.removeEventListener(name, callback);
219
- this.children.map(mesh => {
220
- mesh.removeEventListener(name, callback);
221
- });
222
- }
223
- }
1
+ /*
2
+ * @Author: xiaosihan
3
+ * @Date: 2024-02-05 09:31:57
4
+ * @Last Modified by: xiaosihan
5
+ * @Last Modified time: 2024-06-07 22:14:53
6
+ */
7
+ import { throttle } from "lodash";
8
+ import { Euler, InstancedBufferAttribute, InstancedMesh, Matrix4, Quaternion, Vector3 } from "three";
9
+ import MeshBase from "./MeshBase";
10
+ import threeUtils from "./threeUtils";
11
+ import threeLoader from "./threeLoader";
12
+ // 实例模型组对象
13
+ export default class InstancedMeshBase extends MeshBase {
14
+ constructor(url) {
15
+ super(url);
16
+ }
17
+ isInstancedGroupMesh = true;
18
+ count = 0;
19
+ size = new Vector3(1, 1, 1);
20
+ meshCollect = {};
21
+ instanceCollect = {};
22
+ colorMap = new Map();
23
+ static _position = new Vector3();
24
+ static _scale = new Vector3(1, 1, 1);
25
+ static _rotation = new Euler();
26
+ static _Quaternion = new Quaternion();
27
+ static _matrix = new Matrix4();
28
+ instanceMatrix = new InstancedBufferAttribute(new Float32Array(0 * 16), 16);
29
+ instanceColor = new InstancedBufferAttribute(new Float32Array(0 * 3), 3);
30
+ // 重构加载模型的方法
31
+ async loadModel(url, filename = "") {
32
+ this.url = url;
33
+ if (!url) {
34
+ this.clear();
35
+ return;
36
+ }
37
+ this.loaded = false;
38
+ // 没有模型并且没有加载任务时就去加载模型
39
+ if (!MeshBase.models.get(url) && !MeshBase.loadModeling.get(url)) {
40
+ MeshBase.loadModeling.set(url, true);
41
+ // 万能加载器
42
+ let modal = await threeLoader.loadModel(url, filename);
43
+ threeUtils.center(modal);
44
+ modal.updateMatrixWorld(true);
45
+ MeshBase.models.set(url, modal);
46
+ MeshBase.loadModeling.set(url, false);
47
+ }
48
+ // 如果模型还在加载中, 就等待模型加载完成
49
+ do {
50
+ await new Promise(resolve => setTimeout(resolve, 50));
51
+ } while (MeshBase.loadModeling.get(url));
52
+ if (MeshBase.models.get(url)) {
53
+ this.clear();
54
+ const mesh = MeshBase.models.get(url);
55
+ // // 判断是否有动画
56
+ // this.hasAnimation = mesh.animations.length > 0;
57
+ // if (this.hasAnimation) {
58
+ // const model = SkeletonUtils.clone(mesh);
59
+ // this.mixer = new AnimationMixer(model);
60
+ // this.animationActions = {};
61
+ // mesh.animations.map(animation => {
62
+ // const animationAction = this.mixer!.clipAction(animation).play();
63
+ // animationAction.weight = 0;
64
+ // this.animationActions[animation.name] = animationAction;
65
+ // });
66
+ // this.add(model);
67
+ // } else {
68
+ // this.add(mesh.clone(true));
69
+ // }
70
+ this.size.copy(threeUtils.getSize(mesh));
71
+ const { meshCollect, instanceCollect } = this;
72
+ mesh.updateMatrixWorld(true);
73
+ // collect all mesh counts, in case there are more than one copy of the same mesh in this group
74
+ mesh.traverse((obj) => {
75
+ const mesh = obj;
76
+ if (mesh.isMesh) {
77
+ mesh.matrixWorld.decompose(mesh.position, mesh.quaternion, mesh.scale);
78
+ mesh.rotation.setFromQuaternion(mesh.quaternion);
79
+ mesh.updateMatrix();
80
+ // same geometry and same material consider as the same mesh
81
+ const uuid = mesh.geometry.uuid + '/' + mesh.material.uuid;
82
+ if (meshCollect[uuid]) {
83
+ meshCollect[uuid].push(mesh);
84
+ }
85
+ else {
86
+ meshCollect[uuid] = [mesh];
87
+ }
88
+ }
89
+ else {
90
+ obj.position.set(0, 0, 0);
91
+ obj.scale.set(1, 1, 1);
92
+ obj.rotation.set(0, 0, 0);
93
+ }
94
+ });
95
+ // create all instances
96
+ Object.keys(meshCollect).forEach(uuid => {
97
+ const meshes = meshCollect[uuid];
98
+ const mesh = meshes[0];
99
+ const instancedMesh = new InstancedMesh(mesh.geometry, mesh.material, meshes.length * this.count);
100
+ instancedMesh.name = mesh.name;
101
+ instancedMesh.frustumCulled = false;
102
+ instanceCollect[uuid] = instancedMesh;
103
+ this.add(instancedMesh);
104
+ });
105
+ // 加载完成事件
106
+ await new Promise(resolve => setTimeout(resolve, 30));
107
+ // 加载完成事件
108
+ this.dispatchEvent({ type: "loaded" });
109
+ this.loaded = true;
110
+ }
111
+ }
112
+ // 更新包围盒
113
+ computeBoundingSphere = throttle(() => {
114
+ this.children.map(instancedMesh => {
115
+ instancedMesh.computeBoundingSphere();
116
+ });
117
+ }, 1000);
118
+ //初始实例矩阵的数量
119
+ async setCount(count = 0) {
120
+ if (this.count === count) {
121
+ return;
122
+ }
123
+ await this.awaitLoaded();
124
+ const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
125
+ const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
126
+ for (let i = 0; i < count; i++) {
127
+ instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i * 16);
128
+ instanceColor.set([1, 1, 1], i * 3);
129
+ }
130
+ for (let i = 0; i < this.count; i++) {
131
+ instanceMatrix.copyAt(i, this.instanceMatrix, i);
132
+ instanceColor.copyAt(i, this.instanceColor, i);
133
+ }
134
+ this.instanceMatrix = instanceMatrix;
135
+ this.instanceColor = instanceColor;
136
+ this.count = count;
137
+ this.children.map((instanceMesh) => {
138
+ const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
139
+ const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
140
+ for (let i = 0; i < count; i++) {
141
+ instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i * 16);
142
+ instanceColor.set([1, 1, 1], i * 3);
143
+ }
144
+ for (let i = 0; i < instanceMesh.count; i++) {
145
+ instanceMatrix.copyAt(i, instanceMesh.instanceMatrix, i);
146
+ instanceColor.copyAt(i, instanceMesh.instanceColor, i);
147
+ }
148
+ instanceMesh.instanceMatrix = instanceMatrix;
149
+ instanceMesh.instanceColor = instanceColor;
150
+ instanceMesh.count = count;
151
+ });
152
+ }
153
+ // 设置矩阵
154
+ async setMatrixAt(index, matrix) {
155
+ const new_matrix = matrix.clone();
156
+ await this.awaitLoaded();
157
+ Object.keys(this.meshCollect).forEach(uuid => {
158
+ const instancedMesh = this.instanceCollect[uuid];
159
+ const collect = this.meshCollect[uuid];
160
+ collect.forEach((mesh, i) => {
161
+ InstancedMeshBase._matrix.copy(mesh.matrix);
162
+ InstancedMeshBase._matrix.premultiply(new_matrix);
163
+ instancedMesh.setMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
164
+ instancedMesh.instanceMatrix.needsUpdate = true;
165
+ });
166
+ });
167
+ this.computeBoundingSphere();
168
+ }
169
+ //设置移动旋转缩放
170
+ async setTRS(index, { position = InstancedMeshBase._position, rotation = InstancedMeshBase._rotation, scale = InstancedMeshBase._scale }) {
171
+ const new_position = position.clone();
172
+ const new_rotation = rotation.clone();
173
+ const new_scale = scale.clone();
174
+ await this.awaitLoaded();
175
+ console.log("setTRS", index);
176
+ Object.keys(this.meshCollect).forEach(uuid => {
177
+ const instancedMesh = this.instanceCollect[uuid];
178
+ const collect = this.meshCollect[uuid];
179
+ collect.forEach((mesh, i) => {
180
+ //获取对应的模型的矩阵
181
+ instancedMesh.getMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
182
+ InstancedMeshBase._matrix.premultiply(mesh.matrix.clone().invert());
183
+ InstancedMeshBase._matrix.decompose(InstancedMeshBase._position, InstancedMeshBase._Quaternion, InstancedMeshBase._scale);
184
+ InstancedMeshBase._rotation.setFromQuaternion(InstancedMeshBase._Quaternion);
185
+ InstancedMeshBase._position.copy(new_position);
186
+ InstancedMeshBase._rotation.copy(new_rotation);
187
+ InstancedMeshBase._scale.copy(new_scale);
188
+ InstancedMeshBase._Quaternion.setFromEuler(InstancedMeshBase._rotation);
189
+ InstancedMeshBase._matrix.compose(InstancedMeshBase._position, InstancedMeshBase._Quaternion, InstancedMeshBase._scale);
190
+ InstancedMeshBase._matrix.premultiply(mesh.matrix);
191
+ instancedMesh.setMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
192
+ instancedMesh.instanceMatrix.needsUpdate = true;
193
+ });
194
+ });
195
+ this.computeBoundingSphere();
196
+ }
197
+ // 设置颜色
198
+ async setColorAt(index, color) {
199
+ await this.awaitLoaded();
200
+ Object.keys(this.meshCollect).forEach(uuid => {
201
+ const instancedMesh = this.instanceCollect[uuid];
202
+ const collect = this.meshCollect[uuid];
203
+ collect.forEach((mesh, i) => {
204
+ const c = color(instancedMesh);
205
+ if (c) {
206
+ instancedMesh.setColorAt(collect.length * index + i, c);
207
+ instancedMesh.instanceColor.needsUpdate = true;
208
+ }
209
+ });
210
+ });
211
+ }
212
+ // 同步属性
213
+ updateMatrixWorld(force) {
214
+ super.updateMatrixWorld(force);
215
+ const { cursor, enableEvent } = this.userData;
216
+ this.traverse(obj => {
217
+ Object.assign(obj.userData, { cursor, enableEvent });
218
+ });
219
+ }
220
+ // 事件监听
221
+ async addEventListener(name, callback) {
222
+ super.addEventListener(name, callback);
223
+ await this.awaitLoaded();
224
+ super.addEventListener(name, callback);
225
+ this.children.map(mesh => {
226
+ mesh.addEventListener(name, callback);
227
+ });
228
+ }
229
+ // 取消事件的监听
230
+ removeEventListener(name, callback) {
231
+ super.removeEventListener(name, callback);
232
+ this.children.map(mesh => {
233
+ mesh.removeEventListener(name, callback);
234
+ });
235
+ }
236
+ }
@@ -43,7 +43,6 @@ export default class InstancedMeshBase extends MeshBase {
43
43
 
44
44
  // 重构加载模型的方法
45
45
  async loadModel(url: string, filename: string = "") {
46
-
47
46
  this.url = url;
48
47
 
49
48
  if (!url) {
@@ -138,7 +137,7 @@ export default class InstancedMeshBase extends MeshBase {
138
137
  })
139
138
 
140
139
  // 加载完成事件
141
- await new Promise(resolve => setTimeout(resolve, 100));
140
+ await new Promise(resolve => setTimeout(resolve, 30));
142
141
  // 加载完成事件
143
142
  this.dispatchEvent({ type: "loaded" } as never);
144
143
  this.loaded = true;
@@ -155,14 +154,17 @@ export default class InstancedMeshBase extends MeshBase {
155
154
 
156
155
  //初始实例矩阵的数量
157
156
  async setCount(count: number = 0) {
157
+ if (this.count === count) {
158
+ return;
159
+ }
158
160
  await this.awaitLoaded();
159
161
 
160
162
  const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
161
163
  const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
162
164
 
163
165
  for (let i = 0; i < count; i++) {
164
- instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i);
165
- instanceColor.set([1, 1, 1], i);
166
+ instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i * 16);
167
+ instanceColor.set([1, 1, 1], i * 3);
166
168
  }
167
169
 
168
170
  for (let i = 0; i < this.count; i++) {
@@ -172,6 +174,7 @@ export default class InstancedMeshBase extends MeshBase {
172
174
 
173
175
  this.instanceMatrix = instanceMatrix;
174
176
  this.instanceColor = instanceColor;
177
+
175
178
  this.count = count;
176
179
 
177
180
  this.children.map((instanceMesh: InstancedMesh) => {
@@ -179,9 +182,14 @@ export default class InstancedMeshBase extends MeshBase {
179
182
  const instanceMatrix = new InstancedBufferAttribute(new Float32Array(count * 16), 16);
180
183
  const instanceColor = new InstancedBufferAttribute(new Float32Array(count * 3).fill(1), 3);
181
184
 
185
+ for (let i = 0; i < count; i++) {
186
+ instanceMatrix.set(InstancedMeshBase._matrix.identity().toArray(), i * 16);
187
+ instanceColor.set([1, 1, 1], i * 3);
188
+ }
189
+
182
190
  for (let i = 0; i < instanceMesh.count; i++) {
183
- instanceMatrix.copyAt(i, this.instanceMatrix, i);
184
- instanceColor.copyAt(i, this.instanceColor, i);
191
+ instanceMatrix.copyAt(i, instanceMesh.instanceMatrix, i);
192
+ instanceColor.copyAt(i, instanceMesh.instanceColor, i);
185
193
  }
186
194
 
187
195
  instanceMesh.instanceMatrix = instanceMatrix;
@@ -193,14 +201,14 @@ export default class InstancedMeshBase extends MeshBase {
193
201
 
194
202
  // 设置矩阵
195
203
  async setMatrixAt(index: number, matrix: Matrix4) {
204
+ const new_matrix = matrix.clone();
196
205
  await this.awaitLoaded();
197
-
198
206
  Object.keys(this.meshCollect).forEach(uuid => {
199
207
  const instancedMesh = this.instanceCollect[uuid]
200
208
  const collect = this.meshCollect[uuid]
201
209
  collect.forEach((mesh: Mesh, i: number) => {
202
210
  InstancedMeshBase._matrix.copy(mesh.matrix)
203
- InstancedMeshBase._matrix.premultiply(matrix)
211
+ InstancedMeshBase._matrix.premultiply(new_matrix);
204
212
 
205
213
  instancedMesh.setMatrixAt(collect.length * index + i, InstancedMeshBase._matrix);
206
214
  instancedMesh.instanceMatrix.needsUpdate = true;
@@ -223,8 +231,11 @@ export default class InstancedMeshBase extends MeshBase {
223
231
  scale?: Vector3
224
232
  }
225
233
  ) {
234
+ const new_position = position.clone();
235
+ const new_rotation = rotation.clone();
236
+ const new_scale = scale.clone();
226
237
  await this.awaitLoaded();
227
-
238
+ console.log("setTRS", index);
228
239
  Object.keys(this.meshCollect).forEach(uuid => {
229
240
  const instancedMesh = this.instanceCollect[uuid]
230
241
  const collect = this.meshCollect[uuid]
@@ -241,9 +252,9 @@ export default class InstancedMeshBase extends MeshBase {
241
252
  InstancedMeshBase._scale
242
253
  );
243
254
  InstancedMeshBase._rotation.setFromQuaternion(InstancedMeshBase._Quaternion);
244
- InstancedMeshBase._position.copy(position);
245
- InstancedMeshBase._rotation.copy(rotation);
246
- InstancedMeshBase._scale.copy(scale);
255
+ InstancedMeshBase._position.copy(new_position);
256
+ InstancedMeshBase._rotation.copy(new_rotation);
257
+ InstancedMeshBase._scale.copy(new_scale);
247
258
  InstancedMeshBase._Quaternion.setFromEuler(InstancedMeshBase._rotation);
248
259
 
249
260
  InstancedMeshBase._matrix.compose(
@@ -290,8 +301,8 @@ export default class InstancedMeshBase extends MeshBase {
290
301
 
291
302
  // 事件监听
292
303
  async addEventListener(name: string, callback: (e: any) => void) {
304
+ super.addEventListener(name, callback);
293
305
  await this.awaitLoaded();
294
-
295
306
  super.addEventListener(name, callback);
296
307
  this.children.map(mesh => {
297
308
  mesh.addEventListener(name, callback);
@@ -1,25 +1,25 @@
1
- import { Euler, Line, LineBasicMaterial, Object3D, Vector3 } from "three";
2
- export type Keyframe = {
3
- position: Vector3;
4
- scale: Vector3;
5
- rotation: Euler;
6
- timeTemp: number;
7
- };
8
- export type KeyframeAnimationProps = {
9
- speedScale?: number;
10
- object3d: Object3D;
11
- keyframes: Array<Keyframe>;
12
- };
13
- export default class KeyframeAnimation extends Object3D {
14
- constructor(props: KeyframeAnimationProps);
15
- speedScale: number;
16
- object3d: Object3D;
17
- halperLine: Line<any, LineBasicMaterial>;
18
- keyframes: Array<Keyframe>;
19
- setObject3D(object3d: Object3D): void;
20
- getKeyframe(i: number): Keyframe;
21
- setKeyframe(i: number, keyframe: Keyframe): void;
22
- setKeyframes(keyframes: Array<Keyframe>): void;
23
- update(): void;
24
- updateMatrix(): void;
25
- }
1
+ import { Euler, Line, LineBasicMaterial, Object3D, Vector3 } from "three";
2
+ export type Keyframe = {
3
+ position: Vector3;
4
+ scale: Vector3;
5
+ rotation: Euler;
6
+ timeTemp: number;
7
+ };
8
+ export type KeyframeAnimationProps = {
9
+ speedScale?: number;
10
+ object3d: Object3D;
11
+ keyframes: Array<Keyframe>;
12
+ };
13
+ export default class KeyframeAnimation extends Object3D {
14
+ constructor(props: KeyframeAnimationProps);
15
+ speedScale: number;
16
+ object3d: Object3D;
17
+ halperLine: Line<any, LineBasicMaterial>;
18
+ keyframes: Array<Keyframe>;
19
+ setObject3D(object3d: Object3D): void;
20
+ getKeyframe(i: number): Keyframe;
21
+ setKeyframe(i: number, keyframe: Keyframe): void;
22
+ setKeyframes(keyframes: Array<Keyframe>): void;
23
+ update(): void;
24
+ updateMatrix(): void;
25
+ }