three-base 2.0.134 → 2.0.142

package/PlaneText.ts

@@ -0,0 +1,55 @@
+/*
+ * @Author: xiaosihan
+ * @Date: 2022-05-23 13:53:06
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-05-03 02:54:52
+ */
+import { DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector3 } from "three";
+import SpriteText from "./SpriteText";
+
+type Props = {
+    text?: string;
+    textHeight?: number;
+    color?: string;
+    backgroundColor?: string;
+    fontFace?: string;
+    fontSize?: number;
+    fontWeight?: string;
+    padding?: number | [number, number];
+    borderWidth?: number;
+    borderRadius?: number;
+    borderColor?: string;
+    strokeWidth?: number;
+    strokeColor?: string;
+};
+
+export default class PlaneText extends Mesh {
+    constructor(text: string = "planeText") {
+        super(PlaneText.geometry);
+        this.set({ text });
+    }
+
+    type: string = "PlaneText";
+    static geometry: PlaneGeometry = new PlaneGeometry(1, 1, 1, 1);
+    spriteText: SpriteText = new SpriteText("");
+    material: MeshBasicMaterial = new MeshBasicMaterial({ transparent: true, side: DoubleSide, map: this.spriteText.material.map });
+
+    set(parame: Props): void {
+        for (let key in parame) {
+            const value = parame[key];
+            if (value !== undefined) {
+                // Only set properties that exist on SpriteText and are writable
+                if (key in this.spriteText) {
+                    ((this.spriteText as unknown) as { [key: string]: unknown })[key] = value;
+                }
+            }
+        }
+        this.scale.copy(this.spriteText.scale);
+        this.scale.max(new Vector3(1, 1, 1));
+        this.material.map = this.spriteText.material.map;
+    }
+
+    get<K extends keyof SpriteText>(prop: K): SpriteText[K] {
+        return this.spriteText[prop];
+    }
+}

package/PlaneWithHtml.d.ts

@@ -1,11 +1,13 @@
-import { Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
-export default class PlaneWithHtml extends Mesh {
-    constructor(html?: string, backgroundColor?: `#${string}`);
-    visible: boolean;
-    size: Vector2;
-    geometry: PlaneGeometry;
-    material: MeshBasicMaterial;
-    div: HTMLDivElement;
-    setGeoSize(width: number, height: number): void;
-    setHtml(html?: string, backgroundColor?: `#${string}`): Promise<void>;
-}
+import { Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
+type HexColorString = `#${string}`;
+export default class PlaneWithHtml extends Mesh {
+    constructor(html?: string, backgroundColor?: HexColorString);
+    visible: boolean;
+    size: Vector2;
+    geometry: PlaneGeometry;
+    material: MeshBasicMaterial;
+    div: HTMLDivElement;
+    setGeoSize(width: number, height: number): void;
+    setHtml(html?: string, backgroundColor?: HexColorString): Promise<void>;
+}
+export {};

package/PlaneWithHtml.js

@@ -1,63 +1,64 @@
-/*
- * @Author: xiaosihan
- * @Date: 2023-04-15 11:26:32
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-04-15 12:38:09
- */
-import { snapdom } from "@zumer/snapdom";
-import { Texture, DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
-import { degToRad } from "three/src/math/MathUtils";
-import threeLoader from "./threeLoader";
-// html 文本面板
-export default class PlaneWithHtml extends Mesh {
-    constructor(html = "", backgroundColor = "#00000000") {
-        super();
-        this.setHtml(html, backgroundColor);
-    }
-    visible = false;
-    size = new Vector2(10, 10);
-    geometry = (() => {
-        const geometry = new PlaneGeometry(10, 10, 1, 1);
-        geometry.rotateX(degToRad(-90));
-        return geometry;
-    })();
-    material = new MeshBasicMaterial({
-        side: DoubleSide,
-        transparent: true,
-        alphaTest: 0.1
-    });
-    div = (() => {
-        const div = document.createElement("div");
-        div.style.position = "fixed";
-        div.style.top = "100%";
-        div.style.left = "100%";
-        div.style.pointerEvents = "none";
-        div.style.userSelect = "none";
-        div.style.lineHeight = "1";
-        div.style.whiteSpace = "nowrap";
-        return div;
-    })();
-    // 设置网格尺寸
-    setGeoSize(width, height) {
-        this.size.set(width, height);
-        this.geometry.dispose();
-        const geometry = new PlaneGeometry(width, height, 1, 1);
-        geometry.rotateX(degToRad(-90));
-        this.geometry = geometry;
-    }
-    async setHtml(html = "", backgroundColor = "#00000000") {
-        this.div.innerHTML = html;
-        document.body.appendChild(this.div);
-        const img = await snapdom.toPng(this.div, { backgroundColor });
-        this.setGeoSize(img.naturalWidth, img.naturalHeight);
-        const texture = new Texture(img);
-        texture.needsUpdate = true;
-        this.material.map = texture;
-        this.material.map.anisotropy = threeLoader.anisotropy;
-        this.material.needsUpdate = true;
-        await new Promise(resolve => requestAnimationFrame(resolve));
-        this.visible = true;
-        this.div.remove();
-        this.dispatchEvent({ type: "loaded" });
-    }
-}
+/*
+ * @Author: xiaosihan
+ * @Date: 2023-04-15 11:26:32
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-04-15 12:38:09
+ */
+import { snapdom } from "@zumer/snapdom";
+import { Texture, DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
+import { MathUtils } from "three";
+const { degToRad } = MathUtils;
+import threeLoader from "./threeLoader";
+// html 文本面板
+export default class PlaneWithHtml extends Mesh {
+    constructor(html = "", backgroundColor = "#00000000") {
+        super();
+        this.setHtml(html, backgroundColor);
+    }
+    visible = false;
+    size = new Vector2(10, 10);
+    geometry = (() => {
+        const geometry = new PlaneGeometry(10, 10, 1, 1);
+        geometry.rotateX(degToRad(-90));
+        return geometry;
+    })();
+    material = new MeshBasicMaterial({
+        side: DoubleSide,
+        transparent: true,
+        alphaTest: 0.1
+    });
+    div = (() => {
+        const div = document.createElement("div");
+        div.style.position = "fixed";
+        div.style.top = "100%";
+        div.style.left = "100%";
+        div.style.pointerEvents = "none";
+        div.style.userSelect = "none";
+        div.style.lineHeight = "1";
+        div.style.whiteSpace = "nowrap";
+        return div;
+    })();
+    // 设置网格尺寸
+    setGeoSize(width, height) {
+        this.size.set(width, height);
+        this.geometry.dispose();
+        const geometry = new PlaneGeometry(width, height, 1, 1);
+        geometry.rotateX(degToRad(-90));
+        this.geometry = geometry;
+    }
+    async setHtml(html = "", backgroundColor = "#00000000") {
+        this.div.innerHTML = html;
+        document.body.appendChild(this.div);
+        const img = await snapdom.toPng(this.div, { backgroundColor });
+        this.setGeoSize(img.naturalWidth, img.naturalHeight);
+        const texture = new Texture(img);
+        texture.needsUpdate = true;
+        this.material.map = texture;
+        this.material.map.anisotropy = threeLoader.anisotropy;
+        this.material.needsUpdate = true;
+        await new Promise(resolve => requestAnimationFrame(resolve));
+        this.visible = true;
+        this.div.remove();
+        this.dispatchEvent({ type: "loaded" });
+    }
+}

package/PlaneWithHtml.ts

@@ -0,0 +1,70 @@
+/*
+ * @Author: xiaosihan
+ * @Date: 2023-04-15 11:26:32
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-04-15 12:38:09
+ */
+import { snapdom } from "@zumer/snapdom";
+import { Texture, DoubleSide, Mesh, MeshBasicMaterial, PlaneGeometry, Vector2 } from "three";
+import { MathUtils } from "three";
+const { degToRad } = MathUtils;
+import threeLoader from "./threeLoader";
+
+type HexColorString = `#${string}`;
+
+// html 文本面板
+export default class PlaneWithHtml extends Mesh {
+    constructor(html: string = "", backgroundColor: HexColorString = "#00000000") {
+        super();
+        this.setHtml(html, backgroundColor);
+    }
+
+    visible: boolean = false;
+    size: Vector2 = new Vector2(10, 10);
+    geometry: PlaneGeometry = (() => {
+        const geometry = new PlaneGeometry(10, 10, 1, 1);
+        geometry.rotateX(degToRad(-90));
+        return geometry;
+    })();
+    material: MeshBasicMaterial = new MeshBasicMaterial({
+        side: DoubleSide,
+        transparent: true,
+        alphaTest: 0.1
+    });
+    div: HTMLDivElement = (() => {
+        const div = document.createElement("div");
+        div.style.position = "fixed";
+        div.style.top = "100%";
+        div.style.left = "100%";
+        div.style.pointerEvents = "none";
+        div.style.userSelect = "none";
+        div.style.lineHeight = "1";
+        div.style.whiteSpace = "nowrap";
+        return div;
+    })();
+
+    // 设置网格尺寸
+    setGeoSize(width: number, height: number): void {
+        this.size.set(width, height);
+        this.geometry.dispose();
+        const geometry = new PlaneGeometry(width, height, 1, 1);
+        geometry.rotateX(degToRad(-90));
+        this.geometry = geometry;
+    }
+
+    async setHtml(html: string = "", backgroundColor: HexColorString = "#00000000"): Promise<void> {
+        this.div.innerHTML = html;
+        document.body.appendChild(this.div);
+        const img = await snapdom.toPng(this.div, { backgroundColor });
+        this.setGeoSize(img.naturalWidth, img.naturalHeight);
+        const texture = new Texture(img);
+        texture.needsUpdate = true;
+        this.material.map = texture;
+        this.material.map.anisotropy = threeLoader.anisotropy;
+        this.material.needsUpdate = true;
+        await new Promise(resolve => requestAnimationFrame(resolve));
+        this.visible = true;
+        this.div.remove();
+        this.dispatchEvent({ type: "loaded" } as never);
+    }
+}

package/PointLight/PointLight.d.ts

@@ -1,14 +1,13 @@
-import { Sprite, PointLight as THREEPointLight, Mesh, SphereGeometry, MeshBasicMaterial } from "three";
-import SpriteText from "../SpriteText";
-/**
- * 点光源
- * @export
- * @class PointLight
- * @extends {THREEPointLight}
- */
-export default class PointLight extends THREEPointLight {
-    constructor(color?: string, intensity?: number, distance?: number, decay?: number);
-    pointLinghtHelper: Sprite<import("three").Object3DEventMap>;
-    wireframeSphere: Mesh<SphereGeometry, MeshBasicMaterial, import("three").Object3DEventMap>;
-    label: SpriteText;
-}
+import { Sprite, PointLight as THREEPointLight, Object3DEventMap } from "three";
+import SpriteText from "../SpriteText";
+/**
+ * 点光源
+ * @export
+ * @class PointLight
+ * @extends {THREEPointLight}
+ */
+export default class PointLight extends THREEPointLight {
+    constructor(color?: string, intensity?: number, distance?: number, decay?: number);
+    pointLinghtHelper: Sprite<Object3DEventMap> | false;
+    label: SpriteText | false;
+}

package/PointLight/PointLight.js

@@ -1,70 +1,64 @@
-/*
- * @Author: xiaosihan
- * @Date: 2022-05-18 16:02:55
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-05-03 02:55:28
- */
-import { Sprite, PointLight as THREEPointLight, Mesh, SphereGeometry, MeshBasicMaterial } from "three";
-import threeLoader from "../threeLoader";
-import threeUtils from "../threeUtils";
-import pointLight_mapPNG from "./pointLight_map.png";
-import SpriteText from "../SpriteText";
-/**
- * 点光源
- * @export
- * @class PointLight
- * @extends {THREEPointLight}
- */
-export default class PointLight extends THREEPointLight {
-    constructor(color = "#fff", intensity, distance, decay) {
-        super(color, intensity, distance, decay);
-    }
-    // 灯光辅助器
-    pointLinghtHelper = threeUtils.isDev && (() => {
-        const pointLinghtHelper = new Sprite();
-        pointLinghtHelper.scale.set(0.05, 0.05, 0.05);
-        pointLinghtHelper.material.alphaTest = 0.1;
-        pointLinghtHelper.material.color = this.color;
-        pointLinghtHelper.material.map = threeLoader.getTexture(pointLight_mapPNG);
-        pointLinghtHelper.material.sizeAttenuation = false;
-        pointLinghtHelper.userData = {
-            cursor: "pointer"
-        };
-        pointLinghtHelper.addEventListener("mouseenter", () => {
-            if (this.label) {
-                this.label.visible = true;
-            }
-        });
-        pointLinghtHelper.addEventListener("mouseleave", () => {
-            if (this.label) {
-                this.label.visible = false;
-            }
-        });
-        this.add(pointLinghtHelper);
-        return pointLinghtHelper;
-    })();
-    // 线框球体（位置标识）
-    wireframeSphere = threeUtils.isDev && (() => {
-        const sphere = new Mesh(new SphereGeometry(0.25, 12, 12), new MeshBasicMaterial({ color: this.color, wireframe: true, depthTest: false }));
-        this.add(sphere);
-        return sphere;
-    })();
-    label = threeUtils.isDev && (() => {
-        const label = new SpriteText("点光源\n\n\n");
-        label.renderOrder = Infinity;
-        // label.backgroundColor = "rgba(0, 0, 0, 0.5)";
-        label.padding = 4;
-        label.strokeColor = "#333";
-        label.strokeWidth = 2;
-        // label.borderRadius = 4;
-        // label.borderWidth = 1;
-        label.position.set(0, 0, 0);
-        label.visible = false;
-        label.material.color = this.color;
-        // label.material.depthTest = false;
-        label.material.sizeAttenuation = false;
-        label.scale.multiplyScalar(0.002);
-        this.add(label);
-        return label;
-    })();
-}
+/*
+ * @Author: xiaosihan
+ * @Date: 2022-05-18 16:02:55
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-05-03 02:55:28
+ */
+import { Sprite, PointLight as THREEPointLight } from "three";
+import threeLoader from "../threeLoader";
+import threeUtils from "../threeUtils";
+import pointLight_mapPNG from "./pointLight_map.png";
+import SpriteText from "../SpriteText";
+/**
+ * 点光源
+ * @export
+ * @class PointLight
+ * @extends {THREEPointLight}
+ */
+export default class PointLight extends THREEPointLight {
+    constructor(color = "#fff", intensity, distance, decay) {
+        super(color, intensity, distance, decay);
+    }
+    // 灯光辅助器
+    pointLinghtHelper = threeUtils.isDev && (() => {
+        const pointLinghtHelper = new Sprite();
+        pointLinghtHelper.scale.set(0.05, 0.05, 0.05);
+        pointLinghtHelper.material.alphaTest = 0.1;
+        pointLinghtHelper.material.color = this.color;
+        pointLinghtHelper.material.map = threeLoader.getTexture(pointLight_mapPNG);
+        pointLinghtHelper.material.sizeAttenuation = false;
+        pointLinghtHelper.userData = {
+            cursor: "pointer"
+        };
+        pointLinghtHelper.addEventListener("mouseenter", () => {
+            if (this.label) {
+                this.label.visible = true;
+            }
+        });
+        pointLinghtHelper.addEventListener("mouseleave", () => {
+            if (this.label) {
+                this.label.visible = false;
+            }
+        });
+        this.add(pointLinghtHelper);
+        return pointLinghtHelper;
+    })();
+    label = threeUtils.isDev && (() => {
+        const label = new SpriteText("点光源\n\n\n");
+        label.renderOrder = Infinity;
+        // label.backgroundColor = "rgba(0, 0, 0, 0.5)";
+        label.padding = 4;
+        label.strokeColor = "#333";
+        label.strokeWidth = 2;
+        // label.borderRadius = 4;
+        // label.borderWidth = 1;
+        label.position.set(0, 0, 0);
+        label.visible = false;
+        label.material.color = this.color;
+        // label.material.depthTest = false;
+        label.material.sizeAttenuation = false;
+        label.scale.multiplyScalar(0.002);
+        this.add(label);
+        return label;
+    })();
+}

package/PointLight/PointLight.ts

@@ -0,0 +1,67 @@
+/*
+ * @Author: xiaosihan
+ * @Date: 2022-05-18 16:02:55
+ * @Last Modified by: xiaosihan
+ * @Last Modified time: 2023-05-03 02:55:28
+ */
+import { Sprite, PointLight as THREEPointLight, Object3DEventMap } from "three";
+import threeLoader from "../threeLoader";
+import threeUtils from "../threeUtils";
+import pointLight_mapPNG from "./pointLight_map.png";
+import SpriteText from "../SpriteText";
+
+/**
+ * 点光源
+ * @export
+ * @class PointLight
+ * @extends {THREEPointLight}
+ */
+export default class PointLight extends THREEPointLight {
+    constructor(color: string = "#fff", intensity?: number, distance?: number, decay?: number) {
+        super(color, intensity, distance, decay);
+    }
+
+    // 灯光辅助器
+    pointLinghtHelper: Sprite<Object3DEventMap> | false = threeUtils.isDev && (() => {
+        const pointLinghtHelper = new Sprite();
+        pointLinghtHelper.scale.set(0.05, 0.05, 0.05);
+        pointLinghtHelper.material.alphaTest = 0.1;
+        pointLinghtHelper.material.color = this.color;
+        pointLinghtHelper.material.map = threeLoader.getTexture(pointLight_mapPNG);
+        pointLinghtHelper.material.sizeAttenuation = false;
+        pointLinghtHelper.userData = {
+            cursor: "pointer"
+        };
+        pointLinghtHelper.addEventListener("mouseenter", () => {
+            if (this.label) {
+                this.label.visible = true;
+            }
+        });
+        pointLinghtHelper.addEventListener("mouseleave", () => {
+            if (this.label) {
+                this.label.visible = false;
+            }
+        });
+        this.add(pointLinghtHelper);
+        return pointLinghtHelper;
+    })();
+
+    label: SpriteText | false = threeUtils.isDev && (() => {
+        const label = new SpriteText("点光源\n\n\n");
+        label.renderOrder = Infinity;
+        // label.backgroundColor = "rgba(0, 0, 0, 0.5)";
+        label.padding = 4;
+        label.strokeColor = "#333";
+        label.strokeWidth = 2;
+        // label.borderRadius = 4;
+        // label.borderWidth = 1;
+        label.position.set(0, 0, 0);
+        label.visible = false;
+        label.material.color = this.color;
+        // label.material.depthTest = false;
+        label.material.sizeAttenuation = false;
+        label.scale.multiplyScalar(0.002);
+        this.add(label);
+        return label;
+    })();
+}

package/PointLight/index.d.ts

@@ -1 +1 @@
-export { default } from "./PointLight";
+export { default } from "./PointLight";

package/PointLight/index.js

@@ -1 +1 @@
-export { default } from "./PointLight";
+export { default } from "./PointLight";

package/PointLight/index.ts

@@ -0,0 +1 @@
+export { default } from "./PointLight";