xl-public-utils 1.0.25 → 1.0.26

package/index.d.ts

@@ -970,5 +970,17 @@ declare module "xl-public-utils" {
      * 获取顶点索引映射
      */
     getPointsMapData(polydata: ArrayLike<number>): IndexData;
+    /**
+     * 加载3D模型文件
+     * @param data - 文件路径（字符串）或文件数据（ArrayBuffer）
+     * @param name - 文件名，用于推断文件类型（可选）
+     * @param typeOverride - 手动指定的文件类型，将覆盖文件名推断的类型（可选）
+     * @returns Promise<{ vertices: Float32Array, faces: Uint32Array }> - 包含顶点和面片数据的网格对象
+     */
+    loadFile(
+      data: string | ArrayBuffer,
+      name?: string,
+      typeOverride?: string
+    ): Promise<{ vertices: Float32Array; faces: Uint32Array }>;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xl-public-utils",
-  "version": "1.0.25",
+  "version": "1.0.26",
   "description": "",
   "main": "index.js",
   "module": "index.js",

package/src/drcUtils.js

@@ -323,35 +323,4 @@ export function enCodeMesh(mesh, byteLength = 14, attr = undefined) {
     }
   }
   return enCodeMeshByVF(vertices, faces, byteLength, attr)
-}
-
-/**
- * 初始化Draco文件
- */
-export function initDrcCoder() {
-  if (!globalThis.encoderModule) {
-    const timerEncoder = setInterval(() => {
-      if (globalThis.DracoEncoderModule) {
-        globalThis.DracoEncoderModule().then((res) => {
-          globalThis.encoderModule = res;
-        });
-        clearInterval(timerEncoder);
-      }
-    }, 50);
-  }
-  if (!globalThis.decoderModule) {
-    const timerDecoder = setInterval(() => {
-      if (globalThis.DracoDecoderModule) {
-        globalThis.DracoDecoderModule().then((res) => {
-          globalThis.decoderModule = res;
-          function a() {
-            return res;
-          }
-          // show.value = true;
-          // vtkDracoReader.setDracoDecoder(a);
-        });
-        clearInterval(timerDecoder);
-      }
-    }, 50);
-  }
 }

package/src/model/reader/DRCReader.js

@@ -0,0 +1,24 @@
+import { decodeDrcBufferArray } from "../../drcUtils.js";
+
+/**
+ * @typedef {Object} DracoMesh
+ * @property {Float32Array} vertices
+ * @property {Uint32Array} faces
+ */
+
+class DRCReader {
+  /**
+   * 读取并解码Draco压缩的3D模型文件
+   * @param {ArrayBuffer} buffer - Draco压缩的3D模型数据
+   * @returns {DracoMesh} 解码后的网格数据
+   */
+  static readArrayBuffer(buffer) {
+    const { vertices, faces } = decodeDrcBufferArray(buffer);
+    return {
+      vertices,
+      faces
+    };
+  }
+}
+
+export default DRCReader;

package/src/model/reader/OBJReader.js

@@ -0,0 +1,217 @@
+/**
+ * @typedef {Object} Mesh
+ * @property {number[]} vertices
+ * @property {number[]} colors
+ * @property {number[]} texCoords
+ * @property {number[]} faces
+ * @property {number[]} uvFaces
+ */
+
+/**
+ * @typedef {Object} FinalizedMesh
+ * @property {Float32Array} vertices
+ * @property {Uint32Array} faces
+ * @property {Float32Array | null} colors
+ * @property {Float32Array | null} texCoords
+ * @property {Uint32Array | null} uvFaces
+ */
+
+class OBJReader {
+  static TRI_INDEX = 4294967295;
+
+  /**
+   * @param {string} data 
+   * @returns {FinalizedMesh | FinalizedMesh[]}
+   */
+  static importOBJ(data) {
+    const meshes = [];
+    let currentMesh = {
+      vertices: [],
+      colors: [],
+      texCoords: [],
+      faces: [],
+      uvFaces: []
+    };
+    
+    const lines = data.split('\n');
+    const inv255 = 1.0 / 255;
+    let nbVertices = 0;
+    let nbTexCoords = 0;
+    
+    for (let i = 0; i < lines.length; i++) {
+      const line = lines[i].trim();
+      
+      if (line.length === 0) continue;
+      
+      const firstChar = line[0];
+      
+      if (firstChar === 'v') {
+        const secondChar = line[1];
+        
+        if (secondChar === ' ') {
+          // 顶点坐标
+          const split = line.split(/\s+/);
+          currentMesh.vertices.push(
+            parseFloat(split[1]),
+            parseFloat(split[2]),
+            parseFloat(split[3])
+          );
+          
+          // 顶点颜色（如果存在）
+          if (split[4]) {
+            currentMesh.colors.push(
+              parseFloat(split[4]),
+              parseFloat(split[5]),
+              parseFloat(split[6])
+            );
+          }
+          nbVertices++;
+        } else if (secondChar === 't') {
+          // 纹理坐标
+          const split = line.split(/\s+/);
+          currentMesh.texCoords.push(
+            parseFloat(split[1]),
+            parseFloat(split[2])
+          );
+          nbTexCoords++;
+        }
+      } else if (firstChar === 'f') {
+        // 面
+        const split = line.split(/\s+/);
+        const nbVerts = split.length - 1;
+        
+        if (nbVerts < 3) continue;
+        
+        // 三角化多边形
+        const nbPrim = Math.ceil(nbVerts / 2) - 1;
+        
+        for (let j = 0; j < nbPrim; j++) {
+          const id1 = j + 1;
+          const id2 = j + 2;
+          let id3 = nbVerts - id1;
+          let id4 = nbVerts - j;
+          
+          if (id3 === id2) {
+            id3 = id4;
+            id4 = this.TRI_INDEX;
+          }
+          
+          const sp1 = split[id1].split('/');
+          const sp2 = split[id2].split('/');
+          const sp3 = split[id3].split('/');
+          const isQuad = id4 !== this.TRI_INDEX;
+          const sp4 = isQuad ? split[id4].split('/') : null;
+          
+          let iv1 = parseInt(sp1[0], 10);
+          let iv2 = parseInt(sp2[0], 10);
+          let iv3 = parseInt(sp3[0], 10);
+          let iv4 = isQuad && sp4 ? parseInt(sp4[0], 10) : undefined;
+          
+          // 处理负索引
+          iv1 = iv1 < 0 ? iv1 + nbVertices : iv1 - 1;
+          iv2 = iv2 < 0 ? iv2 + nbVertices : iv2 - 1;
+          iv3 = iv3 < 0 ? iv3 + nbVertices : iv3 - 1;
+          if (isQuad && iv4 !== undefined) {
+            iv4 = iv4 < 0 ? iv4 + nbVertices : iv4 - 1;
+          }
+          
+          // 跳过退化三角形
+          if (iv1 === iv2 || iv1 === iv3 || iv2 === iv3) continue;
+          if (isQuad && iv4 !== undefined && (iv4 === iv1 || iv4 === iv2 || iv4 === iv3)) continue;
+          
+          currentMesh.faces.push(iv1, iv2, iv3, isQuad && iv4 !== undefined ? iv4 : this.TRI_INDEX);
+          
+          // 处理UV坐标
+          if (sp1[1]) {
+            let uv1 = parseInt(sp1[1], 10);
+            let uv2 = parseInt(sp2[1], 10);
+            let uv3 = parseInt(sp3[1], 10);
+            let uv4 = isQuad && sp4 && sp4[1] ? parseInt(sp4[1], 10) : undefined;
+            
+            uv1 = uv1 < 0 ? uv1 + nbTexCoords : uv1 - 1;
+            uv2 = uv2 < 0 ? uv2 + nbTexCoords : uv2 - 1;
+            uv3 = uv3 < 0 ? uv3 + nbTexCoords : uv3 - 1;
+            if (isQuad && uv4 !== undefined) uv4 = uv4 < 0 ? uv4 + nbTexCoords : uv4 - 1;
+            
+            currentMesh.uvFaces.push(uv1, uv2, uv3, isQuad && uv4 !== undefined ? uv4 : this.TRI_INDEX);
+          }
+        }
+      } else if (firstChar === '#') {
+        // 处理ZBrush风格的顶点颜色
+        if (line.startsWith('#MRGB ')) {
+          const split = line.split(/\s+/);
+          const blockMRGB = split[1];
+          
+          for (let m = 2; m < blockMRGB.length; m += 8) {
+            const hex = parseInt(blockMRGB.substr(m, 6), 16);
+            currentMesh.colors.push(
+              ((hex >> 16) & 0xff) * inv255,
+              ((hex >> 8) & 0xff) * inv255,
+              (hex & 0xff) * inv255
+            );
+          }
+        }
+      } else if (line.startsWith('o ')) {
+        // 新对象
+        if (meshes.length > 0) {
+          meshes.push(this.finalizeMesh(currentMesh));
+          currentMesh = {
+            vertices: [],
+            colors: [],
+            texCoords: [],
+            faces: [],
+            uvFaces: []
+          };
+        }
+      }
+    }
+    
+    // 添加最后一个网格
+    meshes.push(this.finalizeMesh(currentMesh));
+    
+    return meshes.length === 1 ? meshes[0] : meshes;
+  }
+  
+  /**
+   * @param {Mesh} mesh 
+   * @returns {FinalizedMesh}
+   */
+  static finalizeMesh(mesh) {
+    // 将四边形拆分为三角形
+    const triangles = [];
+    
+    for (let i = 0; i < mesh.faces.length; i += 4) {
+      const v0 = mesh.faces[i];
+      const v1 = mesh.faces[i + 1];
+      const v2 = mesh.faces[i + 2];
+      const v3 = mesh.faces[i + 3];
+      
+      if (v3 === this.TRI_INDEX) {
+        // 三角形
+        triangles.push(3, v0, v1, v2);
+      } else {
+        // 四边形：拆分为两个三角形
+        triangles.push(3, v0, v1, v2);
+        triangles.push(3, v0, v2, v3);
+      }
+    }
+    
+    return {
+      vertices: new Float32Array(mesh.vertices),
+      faces: new Uint32Array(triangles),
+      colors: mesh.colors.length > 0 ? new Float32Array(mesh.colors) : null,
+      texCoords: mesh.texCoords.length > 0 ? new Float32Array(mesh.texCoords) : null,
+      uvFaces: null // 注意：拆分后UV坐标也需要相应处理
+    };
+  }
+
+  /**
+   * @param {string} data 
+   * @returns {FinalizedMesh | FinalizedMesh[]}
+   */
+  static readFile(data) {
+    return this.importOBJ(data);
+  }
+}
+
+export default OBJReader;

package/src/model/reader/PLYReader.js

@@ -0,0 +1,428 @@
+/**
+ * @typedef {'char' | 'uchar' | 'int8' | 'uint8' | 'short' | 'ushort' | 'int16' | 'uint16' | 
+ * 'int' | 'uint' | 'float' | 'int32' | 'uint32' | 'float32' | 'double' | 'float64'} PLYDataType
+ */
+
+/**
+ * @typedef {Object} PLYProperty
+ * @property {PLYDataType | 'list'} type
+ * @property {string} name
+ * @property {PLYDataType} [countType]
+ * @property {PLYDataType} [itemType]
+ */
+
+/**
+ * @typedef {Object} PLYElement
+ * @property {string} name
+ * @property {number} count
+ * @property {PLYProperty[]} properties
+ */
+
+/**
+ * @typedef {Object} PLYInfo
+ * @property {boolean} binary
+ * @property {boolean} littleEndian
+ * @property {PLYElement[]} elements
+ * @property {number} headerSize
+ * @property {Float32Array | null} vertices
+ * @property {Uint32Array | null} faces
+ * @property {Float32Array | null} colors
+ */
+
+/**
+ * @typedef {Object} PLYMesh
+ * @property {Float32Array | null} vertices
+ * @property {Uint32Array | null} faces
+ * @property {Float32Array | null} colors
+ */
+
+/**
+ * @typedef {(str: string) => number} ParseFunction
+ */
+
+class PLYReader {
+  /**
+   * @param {PLYDataType} type 
+   * @returns {number}
+   */
+  static typeToOctet(type) {
+    switch (type) {
+      case 'char':
+      case 'uchar':
+      case 'int8':
+      case 'uint8':
+        return 1;
+      case 'short':
+      case 'ushort':
+      case 'int16':
+      case 'uint16':
+        return 2;
+      case 'int':
+      case 'uint':
+      case 'float':
+      case 'int32':
+      case 'uint32':
+      case 'float32':
+        return 4;
+      case 'double':
+      case 'float64':
+        return 8;
+      default:
+        return 0;
+    }
+  }
+
+  /**
+   * @param {PLYDataType} type 
+   * @param {boolean} isFloat 
+   * @returns {ParseFunction}
+   */
+  static getParseFunc(type, isFloat) {
+    if (isFloat) {
+      return type === 'double' || type === 'float64' ? parseFloat : parseFloat;
+    }
+    
+    switch (type) {
+      case 'char':
+      case 'int8':
+      case 'short':
+      case 'int16':
+      case 'int':
+      case 'int32':
+        return parseInt;
+      case 'uchar':
+      case 'uint8':
+      case 'ushort':
+      case 'uint16':
+      case 'uint':
+      case 'uint32':
+        return (str) => parseInt(str) >>> 0;
+      default:
+        return parseFloat;
+    }
+  }
+
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @returns {PLYInfo}
+   */
+  static readHeader(buffer) {
+    let lineIndex = 0;
+    const uint8Array = new Uint8Array(buffer);
+    const decoder = new TextDecoder();
+    const headerEndMarker = "end_header\n";
+    let headerEndIndex = 0;
+    
+    for (let i = 0; i < uint8Array.length; i++) {
+        if (String.fromCharCode(...uint8Array.slice(i, i + headerEndMarker.length)) === headerEndMarker) {
+            headerEndIndex = i + headerEndMarker.length;
+            break;
+        }
+    }
+    
+    const headerText = decoder.decode(uint8Array.slice(0, headerEndIndex));
+    const lines = headerText.split('\n');
+    
+    if (lines[lineIndex++].trim() !== 'ply') {
+       throw new Error('Invalid PLY file: missing ply header');
+    }
+    
+    const infos = {
+      binary: false,
+      littleEndian: true,
+      elements: [],
+      headerSize: 0,
+      vertices: null,
+      faces: null,
+      colors: null
+    };
+    
+    while (lineIndex < lines.length) {
+      const line = lines[lineIndex++].trim();
+      
+      if (line === 'end_header') {
+        infos.headerSize = lines.slice(0, lineIndex).join('\n').length + 1;
+        break;
+      }
+      
+      const parts = line.split(/\s+/);
+      
+      if (parts[0] === 'format') {
+        infos.binary = parts[1] === 'binary_little_endian' || parts[1] === 'binary_big_endian';
+        infos.littleEndian = parts[1] !== 'binary_big_endian';
+      } else if (parts[0] === 'element') {
+        const element = {
+          name: parts[1],
+          count: parseInt(parts[2]),
+          properties: []
+        };
+        infos.elements.push(element);
+      } else if (parts[0] === 'property') {
+        const element = infos.elements[infos.elements.length - 1];
+        if (parts[1] === 'list') {
+          element.properties.push({
+            type: 'list',
+            countType: parts[2],
+            itemType: parts[3],
+            name: parts[4]
+          });
+        } else {
+          element.properties.push({
+            type: parts[1],
+            name: parts[2]
+          });
+        }
+      }
+    }
+    
+    return infos;
+  }
+
+  /**
+   * @param {PLYElement} element 
+   * @param {PLYInfo} infos 
+   * @param {Uint8Array} data 
+   * @param {number} offset 
+   * @returns {number}
+   */
+  static readElementVertex(element, infos, data, offset) {
+    const vertices = [];
+    const colors = [];
+    let currentOffset = offset;
+    
+    for (let i = 0; i < element.count; i++) {
+      let x, y, z;
+      let r = 1, g = 1, b = 1;
+      
+      for (const prop of element.properties) {
+        if (infos.binary) {
+          const view = new DataView(data.buffer, currentOffset);
+          let value;
+          
+          switch (prop.type) {
+            case 'float':
+            case 'float32':
+              value = view.getFloat32(0, infos.littleEndian);
+              currentOffset += 4;
+              break;
+            case 'double':
+            case 'float64':
+              value = view.getFloat64(0, infos.littleEndian);
+              currentOffset += 8;
+              break;
+            case 'uchar':
+            case 'uint8':
+              value = view.getUint8(0);
+              currentOffset += 1;
+              break;
+            default:
+              value = view.getInt32(0, infos.littleEndian);
+              currentOffset += 4;
+          }
+          
+          switch (prop.name) {
+            case 'x': x = value; break;
+            case 'y': y = value; break;
+            case 'z': z = value; break;
+            case 'red': r = value / 255; break;
+            case 'green': g = value / 255; break;
+            case 'blue': b = value / 255; break;
+          }
+        }
+      }
+      
+      if (x !== undefined && y !== undefined && z !== undefined) {
+        vertices.push(x, y, z);
+        colors.push(r, g, b);
+      }
+    }
+    
+    infos.vertices = new Float32Array(vertices);
+    infos.colors = new Float32Array(colors);
+    
+    return currentOffset;
+  }
+
+  /**
+   * @param {PLYElement} element 
+   * @param {PLYInfo} infos 
+   * @param {Uint8Array} data 
+   * @param {number} offset 
+   * @returns {number}
+   */
+  static readElementIndex(element, infos, data, offset) {
+    const faces = [];
+    let currentOffset = offset;
+    
+    const listProperty = element.properties.find(p => p.type === 'list');
+    if (!listProperty || !listProperty.countType || !listProperty.itemType) {
+      console.error('无法找到有效的面片list属性');
+      return currentOffset;
+    }
+    
+    const countTypeSize = this.typeToOctet(listProperty.countType);
+    const itemTypeSize = this.typeToOctet(listProperty.itemType);
+    
+    for (let i = 0; i < element.count; i++) {
+      if (infos.binary) {
+        const countView = new DataView(data.buffer, currentOffset);
+        
+        let count;
+        switch (listProperty.countType) {
+          case 'uchar':
+          case 'uint8':
+            count = countView.getUint8(0);
+            break;
+          case 'ushort':
+          case 'uint16':
+            count = countView.getUint16(0, infos.littleEndian);
+            break;
+          default:
+            count = countView.getUint8(0);
+        }
+        currentOffset += countTypeSize;
+        
+        const indexView = new DataView(data.buffer, currentOffset);
+        const indices = [];
+        
+        for (let j = 0; j < count; j++) {
+          let index;
+          const indexOffset = j * itemTypeSize;
+          
+          switch (listProperty.itemType) {
+            case 'uchar':
+            case 'uint8':
+              index = indexView.getUint8(indexOffset);
+              break;
+            case 'ushort':
+            case 'uint16':
+              index = indexView.getUint16(indexOffset, infos.littleEndian);
+              break;
+            case 'uint':
+            case 'uint32':
+              index = indexView.getUint32(indexOffset, infos.littleEndian);
+              break;
+            default:
+              index = indexView.getUint32(indexOffset, infos.littleEndian);
+          }
+          
+          if (infos.vertices && index >= 0 && index < infos.vertices.length / 3) {
+            indices.push(index);
+          } else {
+            console.warn(`面片索引超出范围: ${index}, 顶点数量: ${infos.vertices ? infos.vertices.length / 3 : 0}`);
+            indices.push(0);
+          }
+        }
+        currentOffset += count * itemTypeSize;
+        
+        if (count === 3 && indices.length === 3) {
+          faces.push(3, indices[0], indices[1], indices[2]);
+        } else if (count > 3 && indices.length >= 3) {
+          for (let j = 1; j < count - 1 && j + 1 < indices.length; j++) {
+            faces.push(3, indices[0], indices[j], indices[j + 1]);
+          }
+        }
+      }
+    }
+    
+    infos.faces = new Uint32Array(faces);
+    return currentOffset;
+  }
+
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @returns {PLYMesh}
+   */
+  static importPLY(buffer) {
+    const infos = this.readHeader(buffer);
+    const data = new Uint8Array(buffer);
+    let offset = infos.headerSize;
+    
+    if (!infos.binary) {
+      const text = new TextDecoder().decode(buffer.slice(infos.headerSize));
+      const lines = text.split('\n').filter(line => line.trim());
+      let lineIndex = 0;
+      
+      for (const element of infos.elements) {
+        if (element.name === 'vertex') {
+          const vertices = [];
+          const colors = [];
+          
+          for (let i = 0; i < element.count; i++) {
+            if (lineIndex >= lines.length) {
+              console.error('读取顶点数据时超出文件范围');
+              break;
+            }
+            
+            const values = lines[lineIndex++].trim().split(/\s+/).map(parseFloat);
+            if (values.length >= 3) {
+              vertices.push(values[0], values[1], values[2]);
+              
+              if (values.length >= 6) {
+                colors.push(values[3] / 255, values[4] / 255, values[5] / 255);
+              } else {
+                colors.push(1, 1, 1);
+              }
+            }
+          }
+          
+          infos.vertices = new Float32Array(vertices);
+          infos.colors = new Float32Array(colors);
+        } else if (element.name === 'face') {
+          const faces = [];
+          
+          for (let i = 0; i < element.count; i++) {
+            if (lineIndex >= lines.length) {
+              console.error('读取面片数据时超出文件范围');
+              break;
+            }
+            
+            const values = lines[lineIndex++].trim().split(/\s+/).map(v => parseInt(v));
+            if (values.length < 1) continue;
+            
+            const count = values[0];
+            if (count < 3) continue;
+            
+            if (count === 3) {
+              if (values.length >= 4) {
+                faces.push(3, values[1], values[2], values[3]);
+              }
+            } else {
+              for (let j = 1; j < count - 1; j++) {
+                if (values.length >= j + 3) {
+                  faces.push(3, values[1], values[j + 1], values[j + 2]);
+                }
+              }
+            }
+          }
+          
+          infos.faces = new Uint32Array(faces);
+        }
+      }
+    } else {
+      for (const element of infos.elements) {
+        if (element.name === 'vertex') {
+          offset = this.readElementVertex(element, infos, data, offset);
+        } else if (element.name === 'face') {
+          offset = this.readElementIndex(element, infos, data, offset);
+        }
+      }
+    }
+    
+    return {
+      vertices: infos.vertices,
+      faces: infos.faces,
+      colors: infos.colors
+    };
+  }
+  
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @returns {PLYMesh}
+   */
+  static readArrayBuffer(buffer) {
+    return this.importPLY(buffer);
+  }
+}
+
+export default PLYReader;

package/src/model/reader/STLReader.js

@@ -0,0 +1,249 @@
+// 定义核心数据结构接口
+
+/**
+ * @typedef {Object} STLMesh
+ * @property {Float32Array} vertices
+ * @property {Int32Array} faces
+ * @property {Float32Array | null} [colors]
+ */
+
+/**
+ * @typedef {Object.<string, number>} VertexMap
+ */
+
+class STLReader {
+  /**
+   * @param {VertexMap} mapVertices 
+   * @param {Float32Array} vb 
+   * @param {number} start 
+   * @param {number[]} nbVertices 
+   * @returns {number}
+   */
+  static detectNewVertex(mapVertices, vb, start, nbVertices) {
+    const x = vb[start];
+    const y = vb[start + 1];
+    const z = vb[start + 2];
+    const key = x + ',' + y + ',' + z;
+    
+    let idVertex = mapVertices[key];
+    if (idVertex === undefined) {
+      idVertex = nbVertices[0];
+      mapVertices[key] = idVertex;
+      nbVertices[0]++;
+    }
+    return idVertex;
+  }
+
+  /**
+   * @param {string} data 
+   * @returns {STLMesh}
+   */
+  static importAsciiSTL(data) {
+    const lines = data.split('\n');
+    const vertices = [];
+    const faces = [];
+    const mapVertices = {};
+    const nbVertices = [0];
+    
+    for (let i = 0; i < lines.length; i++) {
+      const line = lines[i].trim();
+      if (line.startsWith('facet')) {
+        // 读取三个顶点
+        const vertex1Line = lines[i + 2] ? lines[i + 2].trim() : '';
+        const vertex2Line = lines[i + 3] ? lines[i + 3].trim() : '';
+        const vertex3Line = lines[i + 4] ? lines[i + 4].trim() : '';
+        
+        if (vertex1Line.startsWith('vertex') && 
+            vertex2Line.startsWith('vertex') && 
+            vertex3Line.startsWith('vertex')) {
+          
+          // 解析顶点坐标
+          const v1 = vertex1Line.split(/\s+/);
+          const v2 = vertex2Line.split(/\s+/);
+          const v3 = vertex3Line.split(/\s+/);
+          
+          if (v1.length >= 4 && v2.length >= 4 && v3.length >= 4) {
+            const coords1 = [parseFloat(v1[1]), parseFloat(v1[2]), parseFloat(v1[3])];
+            const coords2 = [parseFloat(v2[1]), parseFloat(v2[2]), parseFloat(v2[3])];
+            const coords3 = [parseFloat(v3[1]), parseFloat(v3[2]), parseFloat(v3[3])];
+            
+            // 检测或添加唯一顶点
+            const tempVb1 = new Float32Array(coords1);
+            const tempVb2 = new Float32Array(coords2);
+            const tempVb3 = new Float32Array(coords3);
+            
+            const idx1 = this.detectNewVertex(mapVertices, tempVb1, 0, nbVertices);
+            const idx2 = this.detectNewVertex(mapVertices, tempVb2, 0, nbVertices);
+            const idx3 = this.detectNewVertex(mapVertices, tempVb3, 0, nbVertices);
+            
+            // 添加顶点到数组（如果是新顶点）
+            while (vertices.length / 3 <= idx1) {
+              vertices.push(...coords1);
+            }
+            while (vertices.length / 3 <= idx2) {
+              vertices.push(...coords2);
+            }
+            while (vertices.length / 3 <= idx3) {
+              vertices.push(...coords3);
+            }
+            
+            // 添加面片 - 修改为指定格式：[3, 顶点1索引, 顶点2索引, 顶点3索引]
+            faces.push(3, idx1, idx2, idx3);
+          }
+        }
+        
+        // 跳过这个facet的其他行
+        i += 6; // facet + normal + 3*vertex + endfacet + endloop
+      }
+    }
+    
+    return {
+      vertices: new Float32Array(vertices),
+      faces: new Int32Array(faces)
+    };
+  }
+
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @param {number} nbTriangles 
+   * @returns {STLMesh}
+   */
+  static importBinarySTL(buffer, nbTriangles) {
+    const data = new Uint8Array(buffer);
+    const dataHeader = data.subarray(0, 80);
+    const colorMagic = String.fromCharCode.apply(null, Array.from(dataHeader)).indexOf('COLOR=') !== -1;
+
+    const vertices = [];
+    const faces = [];
+    const colors = [];
+    const mapVertices = {};
+    const nbVertices = [0];
+    
+    let offset = 84; // 跳过头部(80字节) + 三角形数量(4字节)
+    
+    for (let i = 0; i < nbTriangles; i++) {
+      // 跳过法向量 (12字节)
+      offset += 12;
+      
+      // 读取三个顶点坐标
+      const view = new DataView(buffer, offset);
+      
+      const v1 = [
+        view.getFloat32(0, true),   // x1
+        view.getFloat32(4, true),   // y1
+        view.getFloat32(8, true)    // z1
+      ];
+      const v2 = [
+        view.getFloat32(12, true),  // x2
+        view.getFloat32(16, true),  // y2
+        view.getFloat32(20, true)   // z2
+      ];
+      const v3 = [
+        view.getFloat32(24, true),  // x3
+        view.getFloat32(28, true),  // y3
+        view.getFloat32(32, true)   // z3
+      ];
+      
+      offset += 36; // 3个顶点 * 12字节
+      
+      // 读取属性字节（颜色信息）
+      const attributeBytes = view.getUint16(36, true);
+      offset += 2;
+      
+      // 检测或添加唯一顶点
+      const tempVb1 = new Float32Array(v1);
+      const tempVb2 = new Float32Array(v2);
+      const tempVb3 = new Float32Array(v3);
+      
+      const idx1 = this.detectNewVertex(mapVertices, tempVb1, 0, nbVertices);
+      const idx2 = this.detectNewVertex(mapVertices, tempVb2, 0, nbVertices);
+      const idx3 = this.detectNewVertex(mapVertices, tempVb3, 0, nbVertices);
+      
+      // 添加顶点到数组（如果是新顶点）
+      while (vertices.length / 3 <= idx1) {
+        vertices.push(...v1);
+      }
+      while (vertices.length / 3 <= idx2) {
+        vertices.push(...v2);
+      }
+      while (vertices.length / 3 <= idx3) {
+        vertices.push(...v3);
+      }
+      
+      // 添加面片 - 修改为指定格式：[3, 顶点1索引, 顶点2索引, 顶点3索引]
+      faces.push(3, idx1, idx2, idx3);
+      
+      // 处理颜色信息
+      let r = 1.0, g = 1.0, b = 1.0;
+      const bit15 = attributeBytes & 32768;
+      
+      if (colorMagic) {
+        if (!bit15) {
+          r = ((attributeBytes & 31) & 31) / 31.0;
+          g = ((attributeBytes >> 5) & 31) / 31.0;
+          b = ((attributeBytes >> 10) & 31) / 31.0;
+        }
+      } else if (bit15) {
+        r = ((attributeBytes >> 10) & 31) / 31.0;
+        g = ((attributeBytes >> 5) & 31) / 31.0;
+        b = ((attributeBytes & 31) & 31) / 31.0;
+      }
+      
+      // 为每个顶点添加颜色（如果还没有）
+      while (colors.length / 3 <= idx1) {
+        colors.push(r, g, b);
+      }
+      while (colors.length / 3 <= idx2) {
+        colors.push(r, g, b);
+      }
+      while (colors.length / 3 <= idx3) {
+        colors.push(r, g, b);
+      }
+    }
+    
+    return {
+      vertices: new Float32Array(vertices),
+      faces: new Int32Array(faces),
+      colors: colors.length > 0 ? new Float32Array(colors) : null
+    };
+  }
+
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @returns {STLMesh}
+   */
+  static importSTL(buffer) {
+    const data = new Uint8Array(buffer);
+    
+    // 检查是否为二进制STL
+    if (data.length < 84) {
+      throw new Error('Invalid STL file: too small');
+    }
+    
+    // 读取三角形数量（二进制格式）
+    const nbTriangles = new Uint32Array(buffer.slice(80, 84))[0];
+    const expectedSize = 84 + nbTriangles * 50;
+    
+    // 检查文件大小是否符合二进制STL格式
+    if (Math.abs(data.length - expectedSize) <= 2) { // 允许小的误差
+      // 二进制STL
+      // console.log(`检测到二进制STL文件，包含 ${nbTriangles} 个三角形`);
+      return this.importBinarySTL(buffer, nbTriangles);
+    } else {
+      // ASCII STL
+      // console.log('检测到ASCII STL文件');
+      const text = new TextDecoder('utf-8').decode(data);
+      return this.importAsciiSTL(text);
+    }
+  }
+
+  /**
+   * @param {ArrayBuffer} buffer 
+   * @returns {STLMesh}
+   */
+  static readArrayBuffer(buffer) {
+    return this.importSTL(buffer);
+  }
+}
+
+export default STLReader;

package/src/threeFont/index.js

@@ -69,12 +69,12 @@ class FontManager {
   generateShapes(text, fontName = 'defaultFont', scale = [0.018, 0.018, 0.018]) {
     const scaleM4 = mat4.scale(mat4.create(), mat4.create(), scale);
 
-    if (this.cacheFontMap[text]) {
-      const newVertices = verticesApplyMat4(scaleM4, this.cacheFontMap[text].vertices);
+    if (this.cacheFontMap[fontName] && this.cacheFontMap[fontName][text]) {
+      const newVertices = verticesApplyMat4(scaleM4, this.cacheFontMap[fontName][text].vertices);
       return {
         vertices: newVertices,
-        faces:  this.cacheFontMap[text].faces,
-        indexData: this.cacheFontPointMap[text]
+        faces:  this.cacheFontMap[fontName][text].faces,
+        indexData: this.cacheFontPointMap[fontName][text]
       };
     }
 
@@ -85,8 +85,8 @@ class FontManager {
     const indexData = this.getPointsMapData(vfData.vertices);
     // console.log(indexData);
     const newVertices = verticesApplyMat4(scaleM4, vfData.vertices);
-    this.cacheFontMap[text] = vfData;
-    this.cacheFontPointMap[text] = indexData;
+    this.cacheFontMap[fontName][text] = vfData;
+    this.cacheFontPointMap[fontName][text] = indexData;
 
     return {
       vertices: newVertices,

package/src/vtkUtils.js

@@ -1,8 +1,12 @@
 import { vec3, mat4, mat3, quat } from 'gl-matrix';
-import { exportBinarySTL } from './exportSTL.js';
-import { writePLY } from "./exportPLY.js";
+import { exportBinarySTL } from './model/wirter/exportSTL.js';
+import { writePLY } from "./model/wirter/exportPLY.js";
 import { enCodeMesh } from './drcUtils.js';
-import { int8ArrayToBase64 } from "./utils.js";
+import { int8ArrayToBase64, getFileExtension } from "./utils.js";
+import PLYReader from './model/reader/PLYReader.js';
+import STLReader from './model/reader/STLReader';
+import OBJReader from './model/reader/OBJReader';
+import DRCReader from './model/reader/DRCReader';
 /**
  * 计算屏幕坐标到三维坐标
  * @param {vtkRenderer} renderer vtkRenderer
@@ -1003,4 +1007,95 @@ export function getPolydataCenterOffset(vertices) {
         y: -(_boundBox.max[1] - _height / 2),
         z: -(_boundBox.max[2] - _surface / 2),
     };
+}
+
+/**
+ * 加载3D模型文件
+ * @param {string | ArrayBuffer} data - 文件路径或文件数据
+ * @param {string} name - 文件名（用于确定文件类型）
+ * @param {string} [typeOverride] - 可选，手动指定的文件类型，将覆盖根据文件名推断的类型
+ * @returns {Promise<{ vertices: MeshVF, faces: MeshVF }>}
+ */
+export async function loadFile(data, name = "", typeOverride = "") {
+  // 优先使用手动指定的类型，否则根据文件名推断
+  const extension = typeOverride || getFileExtension(name);
+  
+  if (typeof data === "string") {
+    // 如果是字符串，作为URL获取文件
+    const response = await fetch(data);
+    
+    if (extension === 'obj') {
+      // OBJ文件需要文本格式
+      const text = await response.text();
+      return loadData(text, extension);
+    } else {
+      // 其他格式获取二进制数据
+      const buffer = await response.arrayBuffer();
+      return loadData(buffer, extension);
+    }
+  } else {
+    // 已经是二进制数据
+    return loadData(data, extension);
+  }
+}
+
+/**
+ * 根据文件类型加载3D模型数据
+ * @param {ArrayBuffer | string} file - 文件数据
+ * @param {string} type - 文件类型: 'stl', 'obj', 'ply', 'drc'
+ * @returns {{ vertices: MeshVF, faces: MeshVF }}
+ */
+export function loadData(file, type = "ply") {
+  let reader;
+  // 根据文件类型选择对应的Reader
+  switch(type) {
+    case 'stl':
+      reader = STLReader;
+      break;
+    case 'obj':
+      reader = OBJReader;
+      break;
+    case 'ply':
+      reader = PLYReader;
+      break;
+    case 'drc':
+      reader = DRCReader;
+      break;
+    default:
+      throw new Error(`Unsupported file type: ${type}`);
+  }
+  
+  // 根据reader类型调用不同的方法
+  let result;
+  if (type === 'obj') {
+    // OBJReader需要字符串数据
+    if (typeof file === 'string') {
+      result = reader.readFile(file);
+    } else {
+      // 如果是ArrayBuffer，转换为字符串
+      const decoder = new TextDecoder('utf-8');
+      const text = decoder.decode(file);
+      result = reader.readFile(text);
+    }
+    
+    // OBJReader可能返回单个mesh或mesh数组，这里取第一个
+    let mesh;
+    if (Array.isArray(result)) {
+      mesh = result[0];
+    } else {
+      mesh = result;
+    }
+    return mesh
+  } else {
+    // 其他Reader使用ArrayBuffer数据
+    if (typeof file === 'string') {
+      throw new Error(`File type ${type} requires ArrayBuffer, but got string`);
+    }
+    result = reader.readArrayBuffer(file);
+    // 确保所有reader返回的格式一致
+    return {
+      vertices: result.vertices,
+      faces: result.faces
+    };
+  }
 }

package/tsconfig.json

@@ -5,5 +5,5 @@
     "emitDeclarationOnly": true,
     "outDir": "types" // 可选，定义.d.ts文件输出目录
   },
-  "include": ["src/*.js", "src/vtkUtils.js", "src/threeFont/font.js",] // 指定包含的 JavaScript 文件路径
+  "include": ["src/*.js", "src/vtkUtils.js", "src/threeFont/font.js", "src/model/wirter/exportPLY.js", "src/model/wirter/exportSTL.js",] // 指定包含的 JavaScript 文件路径
 }

package/types/vtkUtils.d.ts

@@ -1,3 +1,7 @@
+
+import { vec3 } from 'gl-matrix';
+import { mat4 } from 'gl-matrix';
+import { mat3 } from 'gl-matrix';
 /**
  * 计算 w2l(word 2 local, word to local) 的变换矩阵
  * @param {vec3} center 中心点
@@ -276,6 +280,18 @@ export function getmatw2l(center: vec3, xaxis: vec3, yaxis: vec3, zaxis: vec3):
  * @returns { mat4 } 变换矩阵
  */
 export function getmatofl2w(center: vec3, xaxis: vec3, yaxis: vec3, zaxis: vec3): mat4;
+/**
+ * 加载3D模型文件
+ * @param data - 文件路径（字符串）或文件数据（ArrayBuffer）
+ * @param name - 文件名，用于推断文件类型（可选）
+ * @param typeOverride - 手动指定的文件类型，将覆盖文件名推断的类型（可选）
+ * @returns Promise<{ vertices: Float32Array, faces: Uint32Array }> - 包含顶点和面片数据的网格对象
+ */
+export declare function loadFile(
+  data: string | ArrayBuffer,
+  name?: string,
+  typeOverride?: string
+): Promise<{ vertices: Float32Array; faces: Uint32Array }>;
 export type Mesh = {
     /**
      * 点信息
@@ -327,6 +343,3 @@ export type Plane = {
      */
     normal: vec3;
 };
-import { vec3 } from 'gl-matrix';
-import { mat4 } from 'gl-matrix';
-import { mat3 } from 'gl-matrix';