three-base 2.0.142 → 2.0.145

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 (227) hide show
  1. package/DirectionalLight.d.ts +6 -6
  2. package/DirectionalLight.js +68 -68
  3. package/EventMap.d.ts +103 -103
  4. package/EventMap.js +17 -17
  5. package/EventMesh.d.ts +18 -18
  6. package/EventMesh.js +59 -59
  7. package/ExtrudeMesh.d.ts +112 -112
  8. package/ExtrudeMesh.js +342 -342
  9. package/FPScontrol.d.ts +511 -511
  10. package/FPScontrol.js +1799 -1799
  11. package/FPScontrol.ts +1855 -1855
  12. package/Fire/Fire.d.ts +28 -28
  13. package/Fire/Fire.js +80 -80
  14. package/Fire/FireGeometry.d.ts +9 -9
  15. package/Fire/FireGeometry.js +40 -40
  16. package/Fire/FireMaterial.d.ts +28 -28
  17. package/Fire/FireMaterial.js +32 -32
  18. package/Fire/index.d.ts +2 -2
  19. package/Fire/index.js +2 -2
  20. package/GLTFDracoLoader.d.ts +71 -71
  21. package/GLTFDracoLoader.js +266 -266
  22. package/GLTFDracoLoader.ts +1 -1
  23. package/Grass/Grass.d.ts +8 -8
  24. package/Grass/Grass.js +38 -38
  25. package/Grass/index.d.ts +2 -2
  26. package/Grass/index.js +2 -2
  27. package/Ground1/Ground1.d.ts +10 -10
  28. package/Ground1/Ground1.js +71 -71
  29. package/Ground1/index.d.ts +1 -1
  30. package/Ground1/index.js +1 -1
  31. package/MeshBase.d.ts +36 -36
  32. package/MeshBase.js +247 -247
  33. package/Mirror.d.ts +25 -25
  34. package/Mirror.js +143 -143
  35. package/MktMesh/MktMesh.d.ts +301 -291
  36. package/MktMesh/MktMesh.js +1064 -1045
  37. package/MktMesh/MktMesh.ts +32 -11
  38. package/MktMesh/assetUrl.d.ts +59 -35
  39. package/MktMesh/assetUrl.js +154 -69
  40. package/MktMesh/assetUrl.ts +155 -69
  41. package/MktMesh/mktMappingShader.d.ts +12 -12
  42. package/MktMesh/mktMappingShader.js +138 -138
  43. package/MktMesh/mktMappingShader.ts +139 -139
  44. package/MktMesh/mktShader.d.ts +263 -263
  45. package/MktMesh/mktShader.js +1236 -1236
  46. package/MktMesh/mktShader.ts +1344 -1344
  47. package/MktMesh/panoBitmapTexture.d.ts +25 -25
  48. package/MktMesh/panoBitmapTexture.js +52 -52
  49. package/MktMesh/panoBitmapTexture.ts +54 -54
  50. package/MktMesh/panoSlotBind.d.ts +29 -29
  51. package/MktMesh/panoSlotBind.js +106 -106
  52. package/MktMesh/panoSlotBind.ts +153 -153
  53. package/MktMesh/panoSlotRoster.d.ts +22 -22
  54. package/MktMesh/panoSlotRoster.js +169 -169
  55. package/MktMesh/panoSlotRoster.ts +168 -168
  56. package/MktMesh/panoTileStitcher.d.ts +119 -119
  57. package/MktMesh/panoTileStitcher.js +529 -529
  58. package/MktMesh/panoTileStitcher.ts +616 -616
  59. package/MktMesh/types.d.ts +75 -75
  60. package/MktMesh/types.js +1 -1
  61. package/MktMesh/wallCapTessellate.d.ts +33 -33
  62. package/MktMesh/wallCapTessellate.js +97 -97
  63. package/MktMesh/wallCapTessellate.ts +68 -68
  64. package/PipeMesh/PathGeometry.d.ts +44 -44
  65. package/PipeMesh/PathGeometry.js +307 -307
  66. package/PipeMesh/PathPoint.d.ts +17 -17
  67. package/PipeMesh/PathPoint.js +31 -31
  68. package/PipeMesh/PathPointList.d.ts +31 -31
  69. package/PipeMesh/PathPointList.js +209 -209
  70. package/PipeMesh/PathTubeGeometry.d.ts +25 -25
  71. package/PipeMesh/PathTubeGeometry.js +130 -130
  72. package/PipeMesh/PipeMesh.d.ts +25 -25
  73. package/PipeMesh/PipeMesh.js +63 -63
  74. package/PipeMesh/index.d.ts +1 -1
  75. package/PipeMesh/index.js +1 -1
  76. package/PlaneModal1/PlaneModal1.d.ts +34 -34
  77. package/PlaneModal1/PlaneModal1.js +109 -109
  78. package/PlaneModal1/index.d.ts +1 -1
  79. package/PlaneModal1/index.js +1 -1
  80. package/PlaneText.d.ts +27 -27
  81. package/PlaneText.js +35 -35
  82. package/PlaneWithHtml.d.ts +13 -13
  83. package/PlaneWithHtml.js +64 -64
  84. package/PointLight/PointLight.d.ts +13 -13
  85. package/PointLight/PointLight.js +64 -64
  86. package/PointLight/index.d.ts +1 -1
  87. package/PointLight/index.js +1 -1
  88. package/Sky/Sky.d.ts +9 -9
  89. package/Sky/Sky.js +22 -22
  90. package/Sky/index.d.ts +1 -1
  91. package/Sky/index.js +1 -1
  92. package/SpotLight.d.ts +6 -6
  93. package/SpotLight.js +72 -72
  94. package/SpriteModal1/SpriteModal1.d.ts +33 -33
  95. package/SpriteModal1/SpriteModal1.js +116 -116
  96. package/SpriteModal1/index.d.ts +1 -1
  97. package/SpriteModal1/index.js +1 -1
  98. package/SpriteText.d.ts +46 -46
  99. package/SpriteText.js +176 -176
  100. package/SpriteText2.d.ts +48 -48
  101. package/SpriteText2.js +223 -223
  102. package/SpriteText3.d.ts +86 -86
  103. package/SpriteText3.js +517 -517
  104. package/SpriteText3.ts +599 -599
  105. package/SpriteWithHtml.d.ts +9 -9
  106. package/SpriteWithHtml.js +44 -44
  107. package/Text3D/Text3D.d.ts +20 -20
  108. package/Text3D/Text3D.js +58 -58
  109. package/Text3D/fontController.d.ts +60 -60
  110. package/Text3D/fontController.js +166 -166
  111. package/Text3D/index.d.ts +1 -1
  112. package/Text3D/index.js +1 -1
  113. package/ThreeBase.d.ts +248 -248
  114. package/ThreeBase.js +1202 -1202
  115. package/ThreeBase.ts +1314 -1314
  116. package/ThreeMouse.d.ts +53 -54
  117. package/ThreeMouse.js +453 -453
  118. package/Transition.d.ts +45 -45
  119. package/Transition.js +209 -209
  120. package/Water/Water.d.ts +5 -5
  121. package/Water/Water.js +44 -44
  122. package/Water/index.d.ts +2 -2
  123. package/Water/index.js +2 -2
  124. package/WaterFlow/FloatingDuck.d.ts +88 -88
  125. package/WaterFlow/FloatingDuck.js +307 -307
  126. package/WaterFlow/FloatingDuck.ts +445 -445
  127. package/WaterFlow/GPUFluidSimulation.d.ts +56 -56
  128. package/WaterFlow/GPUFluidSimulation.js +781 -781
  129. package/WaterFlow/GPUFluidSimulation.ts +827 -827
  130. package/WaterFlow/ReservoirSystem.d.ts +106 -106
  131. package/WaterFlow/ReservoirSystem.js +611 -611
  132. package/WaterFlow/ReservoirSystem.ts +754 -754
  133. package/WaterFlow/SPHField.d.ts +35 -35
  134. package/WaterFlow/SPHField.js +203 -203
  135. package/WaterFlow/SPHField.ts +228 -228
  136. package/WaterFlow/ScreenSpaceFluidPass.d.ts +69 -69
  137. package/WaterFlow/ScreenSpaceFluidPass.js +728 -728
  138. package/WaterFlow/ScreenSpaceFluidPass.ts +789 -789
  139. package/WaterFlow/ShallowWaterSurface.d.ts +45 -45
  140. package/WaterFlow/ShallowWaterSurface.js +438 -438
  141. package/WaterFlow/ShallowWaterSurface.ts +510 -510
  142. package/WaterFlow/WaterFlow.d.ts +87 -87
  143. package/WaterFlow/WaterFlow.js +171 -171
  144. package/WaterFlow/WaterFlow.ts +219 -219
  145. package/WaterFlow/types.d.ts +161 -161
  146. package/WaterFlow/types.js +1 -1
  147. package/WaterFlow/types.ts +189 -189
  148. package/WaterFlow/waterFlowPass.d.ts +3 -3
  149. package/WaterFlow/waterFlowPass.js +20 -20
  150. package/WaterFlow/waterFlowPass.ts +40 -40
  151. package/collisionOBB.d.ts +42 -42
  152. package/collisionOBB.js +112 -112
  153. package/collisionOBB.ts +108 -108
  154. package/declare.d.ts +25 -25
  155. package/index.d.ts +1 -1
  156. package/index.js +1 -1
  157. package/instanced/InstancedBatch.d.ts +57 -57
  158. package/instanced/InstancedBatch.js +348 -348
  159. package/instanced/InstancedBatch.ts +406 -406
  160. package/instanced/InstancedChild.d.ts +174 -174
  161. package/instanced/InstancedChild.js +264 -264
  162. package/instanced/InstancedChild.ts +327 -327
  163. package/instanced/InstancedGroup.d.ts +43 -43
  164. package/instanced/InstancedGroup.js +126 -126
  165. package/instanced/InstancedGroup.ts +137 -137
  166. package/instanced/InstancedMeshBase.d.ts +38 -38
  167. package/instanced/InstancedMeshBase.js +282 -282
  168. package/instanced/InstancedTemplate.d.ts +46 -46
  169. package/instanced/InstancedTemplate.js +125 -125
  170. package/keyControls.d.ts +29 -30
  171. package/keyControls.js +101 -101
  172. package/lensflare/LensFlare.d.ts +39 -39
  173. package/lensflare/LensFlare.js +284 -284
  174. package/package.json +6 -1
  175. package/pass/bloom_pass.d.ts +2 -2
  176. package/pass/bloom_pass.js +174 -174
  177. package/pass/cover_pass.d.ts +2 -2
  178. package/pass/cover_pass.js +108 -108
  179. package/pass/debugDepthState.d.ts +20 -20
  180. package/pass/debugDepthState.js +9 -9
  181. package/pass/debugDepthState.ts +22 -22
  182. package/pass/depthTestBias.d.ts +12 -12
  183. package/pass/depthTestBias.js +12 -12
  184. package/pass/depthTestBias.ts +12 -12
  185. package/pass/effectUserData.d.ts +27 -27
  186. package/pass/effectUserData.js +1 -1
  187. package/pass/effectUserData.ts +46 -46
  188. package/pass/frosted_glass_pass.d.ts +2 -2
  189. package/pass/frosted_glass_pass.js +150 -150
  190. package/pass/fsQuad.d.ts +9 -9
  191. package/pass/fsQuad.js +28 -28
  192. package/pass/glow_pass.d.ts +2 -2
  193. package/pass/glow_pass.js +350 -350
  194. package/pass/screen_bloom_pass.d.ts +11 -11
  195. package/pass/screen_bloom_pass.js +136 -136
  196. package/pass/ssao_pass.d.ts +88 -88
  197. package/pass/ssao_pass.js +799 -799
  198. package/pass/ssao_pass.ts +918 -918
  199. package/pass/stroke_pass.d.ts +2 -2
  200. package/pass/stroke_pass.js +267 -267
  201. package/shaders/FXAAShaderMaterial.d.ts +3 -3
  202. package/shaders/FXAAShaderMaterial.js +20 -20
  203. package/shaders/baseDepthVisShader.d.ts +11 -11
  204. package/shaders/baseDepthVisShader.js +36 -36
  205. package/shaders/baseDepthVisShader.ts +36 -36
  206. package/shaders/baseTextureToRenderShader.d.ts +2 -2
  207. package/shaders/baseTextureToRenderShader.js +19 -19
  208. package/shaders/copyShader.d.ts +3 -3
  209. package/shaders/copyShader.js +13 -13
  210. package/shaders/debugDepthCompareShader.d.ts +14 -14
  211. package/shaders/debugDepthCompareShader.js +49 -49
  212. package/shaders/debugDepthCompareShader.ts +50 -50
  213. package/shaders/debugDepthJudgeShader.d.ts +18 -18
  214. package/shaders/debugDepthJudgeShader.js +52 -52
  215. package/shaders/debugDepthJudgeShader.ts +54 -54
  216. package/shaders/debugExcludedShader.d.ts +13 -13
  217. package/shaders/debugExcludedShader.js +46 -46
  218. package/shaders/debugExcludedShader.ts +48 -48
  219. package/spriteTextBg.d.ts +1 -1
  220. package/spriteTextBg.js +20 -20
  221. package/spriteTextBg.ts +20 -20
  222. package/threeLoader.d.ts +35 -35
  223. package/threeLoader.js +518 -518
  224. package/threeUtils.d.ts +53 -53
  225. package/threeUtils.js +329 -329
  226. package/types.d.ts +2 -2
  227. package/types.js +6 -6
@@ -1,109 +1,109 @@
1
- /*
2
- * @Author: xiaosihan
3
- * @Date: 2023-03-09 18:51:11
4
- * @Last Modified by: xiaosihan
5
- * @Last Modified time: 2023-03-09 19:15:35
6
- */
7
- import { DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
8
- import threeLoader from "../threeLoader";
9
- import planeModalPNG from "./planeModal.png";
10
- // 平面模型弹窗
11
- export default class PlaneModal1 extends Mesh {
12
- constructor(config = {}) {
13
- super();
14
- this.updata(config);
15
- this.material.map = this.texture;
16
- // this.scale.set(10, 10, 10);
17
- }
18
- geometry = new PlaneGeometry(1 * 0.65, 0.728 * 0.65, 1, 1);
19
- material = new MeshBasicMaterial({
20
- side: DoubleSide,
21
- transparent: true,
22
- alphaTest: 0.01
23
- });
24
- // 背景图
25
- static img = (() => {
26
- const img = new Image();
27
- img.src = planeModalPNG;
28
- return img;
29
- })();
30
- canvas = (() => {
31
- const canvas = document.createElement("canvas");
32
- canvas.width = 660;
33
- canvas.height = 481;
34
- return canvas;
35
- })();
36
- context = this.canvas.getContext("2d");
37
- texture = threeLoader.getTexture(this.canvas);
38
- // 配置
39
- _config = {
40
- size: 10,
41
- title: "PlaneModal1",
42
- titleColor: "#ffffff",
43
- texts: []
44
- // [
45
- // {
46
- // text: "1",
47
- // color: "#ffff00",
48
- // size: 40
49
- // },
50
- // {
51
- // text: "2",
52
- // color: "#ff00ff",
53
- // size: 40
54
- // },
55
- // ]
56
- };
57
- async updata(config) {
58
- Object.assign(this._config, config);
59
- //绘制背景
60
- if (!this.context)
61
- return;
62
- this.context.clearRect(0, 0, 660, 481);
63
- while (!PlaneModal1.img.complete) {
64
- await new Promise(resolve => setTimeout(resolve, 100));
65
- }
66
- // 设置大小
67
- this.scale.set(this._config.size, this._config.size, this._config.size);
68
- // this.context.fillStyle = "#00000088";
69
- // this.context.fillRect(0, 0, 660, 481);
70
- //绘制背景
71
- this.context.drawImage(PlaneModal1.img, 0, 0);
72
- // 绘制标题
73
- this.context.fillStyle = this._config.titleColor;
74
- this.context.font = '40px serif'; // 设置字体大小
75
- this.context.textAlign = "left";
76
- this.context.textBaseline = "top";
77
- this.context.fillText(this._config.title, 60, 72);
78
- let textPos = new Vector2(60, 150);
79
- let maxWidth = 530;
80
- // 绘制内容
81
- this._config.texts.map(({ text = "text", color = "#ffffff", size = 40 }) => {
82
- if (!this.context)
83
- return;
84
- this.context.fillStyle = color;
85
- this.context.font = `${size}px serif`; // 设置字体大小
86
- this.context.textAlign = "left";
87
- this.context.textBaseline = "top";
88
- // 字符分隔为数组
89
- var arrText = text.split('');
90
- var line = '';
91
- for (var n = 0; n < arrText.length; n++) {
92
- var metrics = this.context.measureText(line + arrText[n]);
93
- var testWidth = metrics.width;
94
- if ((testWidth > maxWidth && n > 0) || arrText[n] === "\n") {
95
- this.context.fillText(line, textPos.x, textPos.y);
96
- line = "";
97
- textPos.y += size;
98
- }
99
- else {
100
- line += arrText[n];
101
- }
102
- }
103
- this.context.fillText(line, textPos.x, textPos.y);
104
- textPos.y += size;
105
- });
106
- this.texture.needsUpdate = true;
107
- this.dispatchEvent({ type: "loaded" });
108
- }
109
- }
1
+ /*
2
+ * @Author: xiaosihan
3
+ * @Date: 2023-03-09 18:51:11
4
+ * @Last Modified by: xiaosihan
5
+ * @Last Modified time: 2023-03-09 19:15:35
6
+ */
7
+ import { DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
8
+ import threeLoader from "../threeLoader";
9
+ import planeModalPNG from "./planeModal.png";
10
+ // 平面模型弹窗
11
+ export default class PlaneModal1 extends Mesh {
12
+ constructor(config = {}) {
13
+ super();
14
+ this.updata(config);
15
+ this.material.map = this.texture;
16
+ // this.scale.set(10, 10, 10);
17
+ }
18
+ geometry = new PlaneGeometry(1 * 0.65, 0.728 * 0.65, 1, 1);
19
+ material = new MeshBasicMaterial({
20
+ side: DoubleSide,
21
+ transparent: true,
22
+ alphaTest: 0.01
23
+ });
24
+ // 背景图
25
+ static img = (() => {
26
+ const img = new Image();
27
+ img.src = planeModalPNG;
28
+ return img;
29
+ })();
30
+ canvas = (() => {
31
+ const canvas = document.createElement("canvas");
32
+ canvas.width = 660;
33
+ canvas.height = 481;
34
+ return canvas;
35
+ })();
36
+ context = this.canvas.getContext("2d");
37
+ texture = threeLoader.getTexture(this.canvas);
38
+ // 配置
39
+ _config = {
40
+ size: 10,
41
+ title: "PlaneModal1",
42
+ titleColor: "#ffffff",
43
+ texts: []
44
+ // [
45
+ // {
46
+ // text: "1",
47
+ // color: "#ffff00",
48
+ // size: 40
49
+ // },
50
+ // {
51
+ // text: "2",
52
+ // color: "#ff00ff",
53
+ // size: 40
54
+ // },
55
+ // ]
56
+ };
57
+ async updata(config) {
58
+ Object.assign(this._config, config);
59
+ //绘制背景
60
+ if (!this.context)
61
+ return;
62
+ this.context.clearRect(0, 0, 660, 481);
63
+ while (!PlaneModal1.img.complete) {
64
+ await new Promise(resolve => setTimeout(resolve, 100));
65
+ }
66
+ // 设置大小
67
+ this.scale.set(this._config.size, this._config.size, this._config.size);
68
+ // this.context.fillStyle = "#00000088";
69
+ // this.context.fillRect(0, 0, 660, 481);
70
+ //绘制背景
71
+ this.context.drawImage(PlaneModal1.img, 0, 0);
72
+ // 绘制标题
73
+ this.context.fillStyle = this._config.titleColor;
74
+ this.context.font = '40px serif'; // 设置字体大小
75
+ this.context.textAlign = "left";
76
+ this.context.textBaseline = "top";
77
+ this.context.fillText(this._config.title, 60, 72);
78
+ let textPos = new Vector2(60, 150);
79
+ let maxWidth = 530;
80
+ // 绘制内容
81
+ this._config.texts.map(({ text = "text", color = "#ffffff", size = 40 }) => {
82
+ if (!this.context)
83
+ return;
84
+ this.context.fillStyle = color;
85
+ this.context.font = `${size}px serif`; // 设置字体大小
86
+ this.context.textAlign = "left";
87
+ this.context.textBaseline = "top";
88
+ // 字符分隔为数组
89
+ var arrText = text.split('');
90
+ var line = '';
91
+ for (var n = 0; n < arrText.length; n++) {
92
+ var metrics = this.context.measureText(line + arrText[n]);
93
+ var testWidth = metrics.width;
94
+ if ((testWidth > maxWidth && n > 0) || arrText[n] === "\n") {
95
+ this.context.fillText(line, textPos.x, textPos.y);
96
+ line = "";
97
+ textPos.y += size;
98
+ }
99
+ else {
100
+ line += arrText[n];
101
+ }
102
+ }
103
+ this.context.fillText(line, textPos.x, textPos.y);
104
+ textPos.y += size;
105
+ });
106
+ this.texture.needsUpdate = true;
107
+ this.dispatchEvent({ type: "loaded" });
108
+ }
109
+ }
@@ -1 +1 @@
1
- export { default } from "./PlaneModal1";
1
+ export { default } from "./PlaneModal1";
@@ -1 +1 @@
1
- export { default } from "./PlaneModal1";
1
+ export { default } from "./PlaneModal1";
package/PlaneText.d.ts CHANGED
@@ -1,27 +1,27 @@
1
- import { Mesh, MeshBasicMaterial, PlaneGeometry } from "three";
2
- import SpriteText from "./SpriteText";
3
- type Props = {
4
- text?: string;
5
- textHeight?: number;
6
- color?: string;
7
- backgroundColor?: string;
8
- fontFace?: string;
9
- fontSize?: number;
10
- fontWeight?: string;
11
- padding?: number | [number, number];
12
- borderWidth?: number;
13
- borderRadius?: number;
14
- borderColor?: string;
15
- strokeWidth?: number;
16
- strokeColor?: string;
17
- };
18
- export default class PlaneText extends Mesh {
19
- constructor(text?: string);
20
- type: string;
21
- static geometry: PlaneGeometry;
22
- spriteText: SpriteText;
23
- material: MeshBasicMaterial;
24
- set(parame: Props): void;
25
- get<K extends keyof SpriteText>(prop: K): SpriteText[K];
26
- }
27
- export {};
1
+ import { Mesh, MeshBasicMaterial, PlaneGeometry } from "three";
2
+ import SpriteText from "./SpriteText";
3
+ type Props = {
4
+ text?: string;
5
+ textHeight?: number;
6
+ color?: string;
7
+ backgroundColor?: string;
8
+ fontFace?: string;
9
+ fontSize?: number;
10
+ fontWeight?: string;
11
+ padding?: number | [number, number];
12
+ borderWidth?: number;
13
+ borderRadius?: number;
14
+ borderColor?: string;
15
+ strokeWidth?: number;
16
+ strokeColor?: string;
17
+ };
18
+ export default class PlaneText extends Mesh {
19
+ constructor(text?: string);
20
+ type: string;
21
+ static geometry: PlaneGeometry;
22
+ spriteText: SpriteText;
23
+ material: MeshBasicMaterial;
24
+ set(parame: Props): void;
25
+ get<K extends keyof SpriteText>(prop: K): SpriteText[K];
26
+ }
27
+ export {};
package/PlaneText.js CHANGED
@@ -1,35 +1,35 @@
1
- /*
2
- * @Author: xiaosihan
3
- * @Date: 2022-05-23 13:53:06
4
- * @Last Modified by: xiaosihan
5
- * @Last Modified time: 2023-05-03 02:54:52
6
- */
7
- import { DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector3 } from "three";
8
- import SpriteText from "./SpriteText";
9
- export default class PlaneText extends Mesh {
10
- constructor(text = "planeText") {
11
- super(PlaneText.geometry);
12
- this.set({ text });
13
- }
14
- type = "PlaneText";
15
- static geometry = new PlaneGeometry(1, 1, 1, 1);
16
- spriteText = new SpriteText("");
17
- material = new MeshBasicMaterial({ transparent: true, side: DoubleSide, map: this.spriteText.material.map });
18
- set(parame) {
19
- for (let key in parame) {
20
- const value = parame[key];
21
- if (value !== undefined) {
22
- // Only set properties that exist on SpriteText and are writable
23
- if (key in this.spriteText) {
24
- this.spriteText[key] = value;
25
- }
26
- }
27
- }
28
- this.scale.copy(this.spriteText.scale);
29
- this.scale.max(new Vector3(1, 1, 1));
30
- this.material.map = this.spriteText.material.map;
31
- }
32
- get(prop) {
33
- return this.spriteText[prop];
34
- }
35
- }
1
+ /*
2
+ * @Author: xiaosihan
3
+ * @Date: 2022-05-23 13:53:06
4
+ * @Last Modified by: xiaosihan
5
+ * @Last Modified time: 2023-05-03 02:54:52
6
+ */
7
+ import { DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector3 } from "three";
8
+ import SpriteText from "./SpriteText";
9
+ export default class PlaneText extends Mesh {
10
+ constructor(text = "planeText") {
11
+ super(PlaneText.geometry);
12
+ this.set({ text });
13
+ }
14
+ type = "PlaneText";
15
+ static geometry = new PlaneGeometry(1, 1, 1, 1);
16
+ spriteText = new SpriteText("");
17
+ material = new MeshBasicMaterial({ transparent: true, side: DoubleSide, map: this.spriteText.material.map });
18
+ set(parame) {
19
+ for (let key in parame) {
20
+ const value = parame[key];
21
+ if (value !== undefined) {
22
+ // Only set properties that exist on SpriteText and are writable
23
+ if (key in this.spriteText) {
24
+ this.spriteText[key] = value;
25
+ }
26
+ }
27
+ }
28
+ this.scale.copy(this.spriteText.scale);
29
+ this.scale.max(new Vector3(1, 1, 1));
30
+ this.material.map = this.spriteText.material.map;
31
+ }
32
+ get(prop) {
33
+ return this.spriteText[prop];
34
+ }
35
+ }
@@ -1,13 +1,13 @@
1
- import { Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
2
- type HexColorString = `#${string}`;
3
- export default class PlaneWithHtml extends Mesh {
4
- constructor(html?: string, backgroundColor?: HexColorString);
5
- visible: boolean;
6
- size: Vector2;
7
- geometry: PlaneGeometry;
8
- material: MeshBasicMaterial;
9
- div: HTMLDivElement;
10
- setGeoSize(width: number, height: number): void;
11
- setHtml(html?: string, backgroundColor?: HexColorString): Promise<void>;
12
- }
13
- export {};
1
+ import { Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
2
+ type HexColorString = `#${string}`;
3
+ export default class PlaneWithHtml extends Mesh {
4
+ constructor(html?: string, backgroundColor?: HexColorString);
5
+ visible: boolean;
6
+ size: Vector2;
7
+ geometry: PlaneGeometry;
8
+ material: MeshBasicMaterial;
9
+ div: HTMLDivElement;
10
+ setGeoSize(width: number, height: number): void;
11
+ setHtml(html?: string, backgroundColor?: HexColorString): Promise<void>;
12
+ }
13
+ export {};
package/PlaneWithHtml.js CHANGED
@@ -1,64 +1,64 @@
1
- /*
2
- * @Author: xiaosihan
3
- * @Date: 2023-04-15 11:26:32
4
- * @Last Modified by: xiaosihan
5
- * @Last Modified time: 2023-04-15 12:38:09
6
- */
7
- import { snapdom } from "@zumer/snapdom";
8
- import { Texture, DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
9
- import { MathUtils } from "three";
10
- const { degToRad } = MathUtils;
11
- import threeLoader from "./threeLoader";
12
- // html 文本面板
13
- export default class PlaneWithHtml extends Mesh {
14
- constructor(html = "", backgroundColor = "#00000000") {
15
- super();
16
- this.setHtml(html, backgroundColor);
17
- }
18
- visible = false;
19
- size = new Vector2(10, 10);
20
- geometry = (() => {
21
- const geometry = new PlaneGeometry(10, 10, 1, 1);
22
- geometry.rotateX(degToRad(-90));
23
- return geometry;
24
- })();
25
- material = new MeshBasicMaterial({
26
- side: DoubleSide,
27
- transparent: true,
28
- alphaTest: 0.1
29
- });
30
- div = (() => {
31
- const div = document.createElement("div");
32
- div.style.position = "fixed";
33
- div.style.top = "100%";
34
- div.style.left = "100%";
35
- div.style.pointerEvents = "none";
36
- div.style.userSelect = "none";
37
- div.style.lineHeight = "1";
38
- div.style.whiteSpace = "nowrap";
39
- return div;
40
- })();
41
- // 设置网格尺寸
42
- setGeoSize(width, height) {
43
- this.size.set(width, height);
44
- this.geometry.dispose();
45
- const geometry = new PlaneGeometry(width, height, 1, 1);
46
- geometry.rotateX(degToRad(-90));
47
- this.geometry = geometry;
48
- }
49
- async setHtml(html = "", backgroundColor = "#00000000") {
50
- this.div.innerHTML = html;
51
- document.body.appendChild(this.div);
52
- const img = await snapdom.toPng(this.div, { backgroundColor });
53
- this.setGeoSize(img.naturalWidth, img.naturalHeight);
54
- const texture = new Texture(img);
55
- texture.needsUpdate = true;
56
- this.material.map = texture;
57
- this.material.map.anisotropy = threeLoader.anisotropy;
58
- this.material.needsUpdate = true;
59
- await new Promise(resolve => requestAnimationFrame(resolve));
60
- this.visible = true;
61
- this.div.remove();
62
- this.dispatchEvent({ type: "loaded" });
63
- }
64
- }
1
+ /*
2
+ * @Author: xiaosihan
3
+ * @Date: 2023-04-15 11:26:32
4
+ * @Last Modified by: xiaosihan
5
+ * @Last Modified time: 2023-04-15 12:38:09
6
+ */
7
+ import { snapdom } from "@zumer/snapdom";
8
+ import { Texture, DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
9
+ import { MathUtils } from "three";
10
+ const { degToRad } = MathUtils;
11
+ import threeLoader from "./threeLoader";
12
+ // html 文本面板
13
+ export default class PlaneWithHtml extends Mesh {
14
+ constructor(html = "", backgroundColor = "#00000000") {
15
+ super();
16
+ this.setHtml(html, backgroundColor);
17
+ }
18
+ visible = false;
19
+ size = new Vector2(10, 10);
20
+ geometry = (() => {
21
+ const geometry = new PlaneGeometry(10, 10, 1, 1);
22
+ geometry.rotateX(degToRad(-90));
23
+ return geometry;
24
+ })();
25
+ material = new MeshBasicMaterial({
26
+ side: DoubleSide,
27
+ transparent: true,
28
+ alphaTest: 0.1
29
+ });
30
+ div = (() => {
31
+ const div = document.createElement("div");
32
+ div.style.position = "fixed";
33
+ div.style.top = "100%";
34
+ div.style.left = "100%";
35
+ div.style.pointerEvents = "none";
36
+ div.style.userSelect = "none";
37
+ div.style.lineHeight = "1";
38
+ div.style.whiteSpace = "nowrap";
39
+ return div;
40
+ })();
41
+ // 设置网格尺寸
42
+ setGeoSize(width, height) {
43
+ this.size.set(width, height);
44
+ this.geometry.dispose();
45
+ const geometry = new PlaneGeometry(width, height, 1, 1);
46
+ geometry.rotateX(degToRad(-90));
47
+ this.geometry = geometry;
48
+ }
49
+ async setHtml(html = "", backgroundColor = "#00000000") {
50
+ this.div.innerHTML = html;
51
+ document.body.appendChild(this.div);
52
+ const img = await snapdom.toPng(this.div, { backgroundColor });
53
+ this.setGeoSize(img.naturalWidth, img.naturalHeight);
54
+ const texture = new Texture(img);
55
+ texture.needsUpdate = true;
56
+ this.material.map = texture;
57
+ this.material.map.anisotropy = threeLoader.anisotropy;
58
+ this.material.needsUpdate = true;
59
+ await new Promise(resolve => requestAnimationFrame(resolve));
60
+ this.visible = true;
61
+ this.div.remove();
62
+ this.dispatchEvent({ type: "loaded" });
63
+ }
64
+ }
@@ -1,13 +1,13 @@
1
- import { Sprite, PointLight as THREEPointLight, Object3DEventMap } from "three";
2
- import SpriteText from "../SpriteText";
3
- /**
4
- * 点光源
5
- * @export
6
- * @class PointLight
7
- * @extends {THREEPointLight}
8
- */
9
- export default class PointLight extends THREEPointLight {
10
- constructor(color?: string, intensity?: number, distance?: number, decay?: number);
11
- pointLinghtHelper: Sprite<Object3DEventMap> | false;
12
- label: SpriteText | false;
13
- }
1
+ import { Sprite, PointLight as THREEPointLight, Object3DEventMap } from "three";
2
+ import SpriteText from "../SpriteText";
3
+ /**
4
+ * 点光源
5
+ * @export
6
+ * @class PointLight
7
+ * @extends {THREEPointLight}
8
+ */
9
+ export default class PointLight extends THREEPointLight {
10
+ constructor(color?: string, intensity?: number, distance?: number, decay?: number);
11
+ pointLinghtHelper: Sprite<Object3DEventMap> | false;
12
+ label: SpriteText | false;
13
+ }