• 正文概述
  • GitHub – xeokit/xeokit-convert:使用 xeokit 转换各种 AEC 模型格式,以便在浏览器中高效查看。

    Name
    6 months ago
    6 months ago
    4 years ago
    last year
    5 months ago
    6 months ago
    4 years ago
    4 years ago
    3 years ago
    5 months ago
    last month
    last month
    last year
    last month
    2 weeks ago
    8 months ago
    last year
    6 months ago
    last year
    5 months ago
    last month
    last month
    6 months ago
    5 months ago

    xeokit-convert

    使用 xeokit-convert 可以:

    • 将 BIM 和 AEC 模型直接转换为 XKT 文件,以便超快速加载到 xeokit 中
    • 使用 JavaScript 生成 XKT 文件

    xeokit-convert 取代了已弃用的 xeokit-gltf-to-xkt 和 xeokit-xkt-utils

    注意:直接 IFC 转换是 alpha 状态功能,因为它依赖于 web-ifc,一个第三方库,目前也是 alpha。因此,某些 IFC 模型可能无法正确转换,并且不支持属性集。这就是为什么,请考虑使用我们的标准转换设置,使用 cxConverter 将 IFC 转换为二进制 glTF (GLB)。编译后的 C++ CLI 应用程序可通过此链接获得,包括 PDF 文档。请务必查看使用 cxConverter 的 WASM 版本的直接 IFC 转换!


    如果您对用于您自己的解决方案的即用型 3D/BIM 查看生态系统感兴趣,请务必查看:

    • xeoServices – 完整的转换 (IFC-GLB-XKT-JSON) 和验证 (IDS, IFC) 管道,可以轻松部署在您的基础设施上。立即在 contact@creoox.com 请求您的访问令牌
    • xeoVision – 立即查看(并使用日志调试)您的模型!

    内容


    介绍

    xeokit-convert 提供了转换 3D BIM 和 AEC 模型的方法 转换为 XKT 文件,以便超快速加载到 xeokit 中,以及用于生成 XKT 的编程工具 文件,在Node.js上使用JavaScript。

    XKT 格式将大型双精度模型压缩为 一个紧凑的有效负载,可通过 Web 快速加载到浏览器中运行的 xeokit 查看器中。我们可以使用 xeokit-convert 将多种源格式转换为 XKT,例如 IFC、GLB 和 CityJSON。

    确认

    我们感谢这些开源库的作者,我们在内部使用它们:xeokit-convert

    资源

    特征

    • 一种基于 Node 的 CLI 工具,用于将各种 3D 模型格式转换为 XKT 文件。
    • 用于加载、生成和保存 XKT 文件的组件的 JavaScript 工具包。

    安装

    下面列出了安装和使用的不同方式。xeokit-convert

    Node.js安装

    在Node.js上使用时,您有以下选项:

    先决条件

    NodeJS至少v18.x

    通过 NPM 全局安装

    npm install -g @xeokit/xeokit-convert
    

    然后你可以运行:

    xeokit-convert -h
    

    从源代码安装

    确保您已首次安装,并且您的版本至少为gitNodeJSv16.10.0.

    git clone https://github.com/xeokit/xeokit-convert.git
    cd xeokit-convert/
    npm install

    然后你可以使用 node.js 运行它

    node convert2xkt.js -h
    

    安装为 NPM 项目级别依赖项

    npm install @xeokit/xeokit-convert
    

    在这种情况下,您可以将其直接导入到代码库或运行它

    node node_modules/@xeokit/xeokit-convert/convert2xkt.js -h
    

    如果您在转换 IFC 时得到,那么您需要编译 适用于您系统的第三方 web-ifc WASM 模块 – 请参阅构建二进制文件RuntimeError: memory access out of bounds

    组件

    下表列出了 提供的组件。xeokit-convert

    在工具包的中心,我们有一个转换器工具,它作为 Node.js 函数和 CLI 可执行文件提供。

    与转换器捆绑在一起,我们有 XKT 文档模型、一堆不同格式的加载器和一个函数 将文档模型序列化为 BLOB。我们在转换器工具中使用这些组件,并将它们作为 公共 API 的一部分,以实现可扩展性。

    元件 描述
    convert2xkt(函数)
    convert2xkt(节点脚本)
    基于 Node 的 JavaScript 函数和 CLI 工具,可将各种 AEC 模型格式转换为 seokit 的原生、超快速加载的 XKT 格式。
    XKT模型 一种 JavaScript 文档模型,表示内存中 XKT 文件的内容。使用它,我们可以在 JavaScript 中以编程方式构建文档模型,添加几何体、材质、对象等,然后将其序列化为 XKT 文件。
    解析IFCIntoXKTModel 将 IFC 数据解析为 .这是 alpha 状态功能。XKTModel
    解析GLTFIntoXKTModel 将 GLB 解析为 .支持纹理。XKTModel
    parseCityJSONIntoXKTModel 将 CityJSON 解析为XKTModel
    parseLASIntoXKTModel 将 LAS 和 LAZ 解析为XKTModel
    parseSTLIntoXKTModel 将 STL 解析为XKTModel
    writeXKTModelToArrayBuffer 将 an 序列化为 XKT 文件XKTModel

    convert2xkt

    该工具将各种模型格式转换为 xiokit 的原生 XKT 格式,该格式旨在加载通过 Web 超快地进入 xeokit 查看器。我们提供此工具作为 CLI 脚本和一个在我们自己的节点脚本中使用的函数convert2xkt

    node convert2xkt.js -h
    
    Usage: convert2xkt [options]
    
    Options:
      -v, --version                     output the version number
      -s, --source [file]               path to source file
      -a, --sourcemanifest [file]       path to source manifest file (for converting split file output from ifcgltf -s)
      -f, --format [string]             source file format (optional); supported formats are glb, ifc, laz, las, pcd, ply, stl and cityjson
      -m, --metamodel [file]            path to source metamodel JSON file (optional)
      -i, --include [types]             only convert these types (optional)
      -x, --exclude [types]             never convert these types (optional)
      -r, --rotatex                     rotate model 90 degrees about X axis (for las and cityjson)
      -g, --disablegeoreuse             disable geometry reuse (optional)
      -z, --mintilesize [number]        minimum diagonal tile size (optional, default 500)
      -t, --disabletextures             ignore textures (optional)
      -n, --disablenormals              ignore normals (optional)
      -b, --compressBuffers             compress buffers (optional)
      -e, --maxIndicesForEdge [number]  max number of indices in a mesh (effectively triangles), above edges are not calculated (optional, default 100000)
      -o, --output [file]          path to target .xkt file when -s option given, or JSON manifest for multiple .xkt files when source manifest file given with -a; creates directories on path automatically if not existing
      -l, --log                    enable logging (optional)
      -h, --help                   display help for command
    
    XKT version: 12

    在命令行上将 IFC 文件转换为 XKT 文件

    让我们使用 convert2xkt 节点脚本在命令行上将IFC 文件转换为 XKT。

    node convert2xkt.js -s rme_advanced_sample_project.ifc -o rme_advanced_sample_project.ifc.xkt -l
    
    [convert2xkt] Reading input file: rme_advanced_sample_project.ifc
    [convert2xkt] Input file size: 35309.94 kB
    [convert2xkt] Geometry reuse is enabled
    [convert2xkt] Converting...
    [convert2xkt] Converted to: XKT v9
    [convert2xkt] XKT size: 1632.98 kB
    [convert2xkt] Compression ratio: 21.62
    [convert2xkt] Conversion time: 54.41 s
    [convert2xkt] Converted metaobjects: 0
    [convert2xkt] Converted property sets: 0
    [convert2xkt] Converted drawable objects: 1986
    [convert2xkt] Converted geometries: 3897
    [convert2xkt] Converted triangles: 286076
    [convert2xkt] Converted vertices: 547740
    [convert2xkt] reuseGeometries: false
    [convert2xkt] minTileSize: 10000
    [convert2xkt] Writing XKT file: rme_advanced_sample_project.ifc.xkt

    使用 xeokit 查看 XKT 文件

    现在我们已经有了 XKT 文件,我们现在可以使用 xeokit 查看器配置了 一个 XKTLoaderPlugin 。

    import {Viewer, XKTLoaderPlugin} from
            "https://cdn.jsdelivr.net/npm/@xeokit/xeokit-sdk@1/dist/xeokit-sdk.es.min.js";
    
    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    const modelNode = xktLoader.load({
        id: "myModel",
        src: "./rme_sample_project.ifc.xkt"
    });

    在Node.js中查询 XKT 版本

    注意

    在这种情况下,最好使用 np 将 xeokit-convert 安装到您的项目中,

    通过 Node 脚本,我们可以查询当前生成的 XKT 版本:xeokit-convert

    这是一个完整的示例,展示了如何查询 XKT 版本:./examples/sample-project/xkt-version.js

    import { XKT_INFO } from '@xeokit/xeokit-convert';
    
    const xktVersion = XKT_INFO.xktVersion; // Unsigned integer
    console.log(`XKT version: ${xktVersion}`);

    在 Node.js 中将 IFC 文件转换为 XKT 文件

    我们可以使用 convert2xkt 函数,以编程方式将文件转换为 XKT。

    import { convert2xkt } from '@xeokit/xeokit-convert';
    import WebIFC from "web-ifc/web-ifc-api-node.js";
    
    // For IFC files, we need to explicitly pass the WebIFC library
    convert2xkt({
      WebIFC, // Required for IFC conversion
      source: "./assets/Duplex.ifc",
      output: "./assets/Duplex.ifc.xkt",
      log: (msg) => {
          console.log(msg)
      }
    }).then(() => {
      console.log("Converted.");
    }, (errMsg) => {
      console.error("Conversion failed: " + errMsg)
    });

    在Node.js中将 IFC 文件数据转换为 XKT 数据

    使用时 convert2xkt 函数,我们可以管理内存中的所有文件数据。

    当我们想要更好地控制读取和写入文件的位置时,这非常有用。

    import { convert2xkt } from '@xeokit/xeokit-convert';
    import WebIFC from "web-ifc/web-ifc-api-node.js";
    import fs from 'fs';
    
    // For IFC files, explicitly pass WebIFC
    convert2xkt({
        WebIFC, // Required for IFC conversion
        sourceData: fs.readFileSync("./assets/Duplex.ifc"),
        sourceFormat: "ifc",
        outputXKT: (xtkArrayBuffer) => {
            fs.writeFileSync("./assets/Duplex.ifc.xkt", xtkArrayBuffer);
        }
    }).then(() => {
        console.log("Converted.");
    }, (errMsg) => {
        console.error("Conversion failed: " + errMsg)
    });

    使用时 convert2xkt 函数,我们可以管理内存中的所有文件数据。

    当我们想要更好地控制读取和写入文件的位置时,这非常有用。

    转换从中输出的拆分文件cxconverter

    cxconverter 工具可以选择将 IFC 文件转换为多个 GLB 和 JSON 元数据文件。然后我们可以使用来转换这些中的每一个文件单独。这使我们能够将一个巨大的 IFC 文件转换为几个较小的 XKT 文件,然后加载这些 XKT 文件单独放入 xeokit 查看器中。convert2xkt

    用法

    使用以下选项运行,将 IFC 文件转换为一组多个几何体和元数据文件:cxconverter-sglbjson

    cxconverter -i model.ifc -o myGLBFiles/model.glb -m myGLBFiles/model.json -s 100
    

    该选项会导致将输出拆分为多个文件,每个文件不大于 100MBytes。cxconverter-s 100cxconverter

    目录的内容如下所示:myGLBFiles

    myGLBFiles
    ├── model.glb
    ├── model.json
    ├── model_1.glb
    ├── model_1.json
    ├── model_2.glb
    ├── model_2.json
    ├── model_3.glb
    ├── model_3.json
    └── model.glb.manifest.json
    

    现在使用该选项运行,指向文件:convert2xkt-amyGLBFiles/model.glb.manifest.json

    node convert2xkt.js -a myGLBFiles/model.glb.manifest.json -o myXKTFiles -l

    现在的内容是这样的:myXKTFiles

    myXKTFiles
    ├── model.xkt
    ├── model_1.xkt
    ├── model_2.xkt
    ├── model_3.xkt
    └── model.xkt.manifest.json
    

    该文件如下所示:model.xkt.manifest

    {
      "inputFile": "/absolute/path/myGLBFiles/model.glb.manifest.json",
      "converterApplication": "convert2xkt",
      "converterApplicationVersion": "v1.1.8",
      "conversionDate": "09-08-2023- 23-53-30",
      "outputDir": "/absolute/path/myXKTFiles",
      "xktFiles": [
        "model.xkt",
        "model_1.xkt",
        "model_2.xkt",
        "model_3.xkt"
      ]
    }

    然后,我们可以将这些 XKT 文件加载到 xeokit 查看器中,查看器会自动将它们的几何形状和元数据组合到同一个场景中。

    XKTModel

    XKTModel是一个 JavaScript 类,表示内存中 XKT 文件的内容。

    它是一种 XKT 文档模型,具有在其中构建 3D 对象的方法、导入各种模型的函数格式,以及将其序列化为 XKT 文件的函数。

    我们可以使用这些工具来:

    • 以编程方式进行 XKT 文件,
    • 将多个模型组合成一个 XKT 文件,来自不同的格式,
    • 开发自定义 XKT 转换器,以及
    • 扩展以支持更多格式。convert2xkt

    以编程方式构建 XKT 文件

    为了演示 API,让我们使用 XKTModel 的builder 方法以编程方式构建类似于下面屏幕截图的模型。然后我们将the 序列化为 an ,我们最终将其加载到xeokit 使用 XKTLoaderPlugin 查看中。XKTModelArrayBuffer

    使用 xeokit 转换各种 AEC 模型格式,以便在浏览器中高效查看。

    import { XKTModel, writeXKTModelToArrayBuffer } from '@xeokit/xeokit-convert';
    import fs from 'fs';
    
    const xktModel = new XKTModel();
    
    // Create metamodel - this part is optional
    
    // Create property sets to hold info about the model
    
    xktModel.createPropertySet({
      propertySetId: "tableTopPropSet",
      propertySetType: "Default",
      propertySetName: "Table Top",
      properties: [
          {
              id: "tableTopMaterial",
              type: "Default",
              name: "Table top material",
              value: "Marble"
          },
          {
              id: "tableTopDimensions",
              type: "Default",
              name: "Table top dimensions",
              value: "90x90x3 cm"
          }
      ]
    });
    
    xktModel.createPropertySet({
      propertySetId: "tableLegPropSet",
      propertySetType: "Default",
      propertySetName: "Table Leg",
      properties: [
          {
              id: "tableLegMaterial",
              type: "Default",
              name: "Table leg material",
              value: "Pine"
          },
          {
              id: "tableLegDimensions",
              type: "Default",
              name: "Table leg dimensions",
              value: "5x5x50 cm"
          }
      ]
    });
    
    // Create a hierarchy of metaobjects to describe the structure of the model
    
    xktModel.createMetaObject({ // Root XKTMetaObject, has no XKTEntity
      metaObjectId: "table",
      metaObjectName: "The Table",
      metaObjectType: "furniture"
    });
    
    xktModel.createMetaObject({
      metaObjectId: "redLeg",
      metaObjectName: "Red Table Leg",
      metaObjectType: "furniturePart",
      parentMetaObjectId: "table",
      propertySetIds: ["tableLegPropSet"]
    });
    
    xktModel.createMetaObject({
      metaObjectId: "greenLeg",
      metaObjectName: "Green Table Leg",
      metaObjectType: "furniturePart",
      parentMetaObjectId: "table",
      propertySetIds: ["tableLegPropSet"]
    });
    
    xktModel.createMetaObject({
      metaObjectId: "blueLeg",
      metaObjectName: "Blue Table Leg",
      metaObjectType: "furniturePart",
      parentMetaObjectId: "table",
      propertySetIds: ["tableLegPropSet"]
    });
    
    xktModel.createMetaObject({
      metaObjectId: "yellowLeg",
      metaObjectName: "Yellow Table Leg",
      metaObjectType: "furniturePart",
      parentMetaObjectId: "table",
      propertySetIds: ["tableLegPropSet"]
    });
    
    xktModel.createMetaObject({
      metaObjectId: "pinkTop",
      metaObjectName: "The Pink Table Top",
      metaObjectType: "furniturePart",
      parentMetaObjectId: "table",
      propertySetIds: ["tableTopPropSet"]
    });
    
    // Create an XKTGeometry that defines a box shape, as a triangle mesh
    
    xktModel.createGeometry({
      geometryId: "boxGeometry",
      primitiveType: "triangles", // Also "lines" and "points"
      positions: [
          1, 1, 1, -1, 1, 1, -1, -1, 1, 1, -1, 1, 1, 1, 1, 1, -1, 1, 1, -1, -1, 1, 1, -1, 1, 1, 1, 1, 1, -1, -1, 1,
          -1, -1, 1, 1, -1, 1, 1, -1, 1, -1, -1, -1, -1, -1, -1, 1, -1, -1, -1, 1, -1, -1, 1, -1, 1, -1, -1, 1, 1, -1,
          -1, -1, -1, -1, -1, 1, -1, 1, 1, -1
      ],
      normals: [ // Only for "triangles"
          0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0,
          -1, 0, 0, -1, 0, 0, -1, 0, 0, -1, 0, 0, 0, -1, 0, 0, -1, 0, 0, -1, 0, 0, -1, 0, 0, 0, -1, 0, 0, -1, 0, 0,
          -1, 0, 0, -1
      ],
      indices: [
          0, 1, 2, 0, 2, 3, 4, 5, 6, 4, 6, 7, 8, 9, 10, 8, 10, 11, 12, 13, 14, 12, 14, 15, 16, 17, 18, 16, 18, 19,
          20, 21, 22, 20, 22, 23
      ]
    });
    
    // Create five XKTMeshes, which represent the table top and legs.
    // Each XKTMesh has its own color, position, orientation and size,
    // and uses the XKTGeometry to define its shape.
    // An XKTGeometry can be used by multiple XKTMeshes.
    
    xktModel.createMesh({
      meshId: "redLegMesh",
      geometryId: "boxGeometry",
      position: [-4, -6, -4],
      scale: [1, 3, 1],
      rotation: [0, 0, 0],
      color: [1, 0, 0],
      opacity: 1
    });
    
    xktModel.createMesh({
      meshId: "greenLegMesh",
      geometryId: "boxGeometry",
      position: [4, -6, -4],
      scale: [1, 3, 1],
      rotation: [0, 0, 0],
      color: [0, 1, 0],
      opacity: 1
    });
    
    xktModel.createMesh({
      meshId: "blueLegMesh",
      geometryId: "boxGeometry",
      position: [4, -6, 4],
      scale: [1, 3, 1],
      rotation: [0, 0, 0],
      color: [0, 0, 1],
      opacity: 1
    });
    
    xktModel.createMesh({
      meshId: "yellowLegMesh",
      geometryId: "boxGeometry",
      position: [-4, -6, 4],
      scale: [1, 3, 1],
      rotation: [0, 0, 0],
      color: [1, 1, 0],
      opacity: 1
    });
    
    xktModel.createMesh({
      meshId: "pinkTopMesh",
      geometryId: "boxGeometry",
      position: [0, -3, 0],
      scale: [6, 0.5, 6],
      rotation: [0, 0, 0],
      color: [1, 0, 1],
      opacity: 1
    });
    
    // Create five XKTEntities, which represent abstract, named objects in the model.
    // Each XKTEntity has an XKTMesh.
    // An XKTEntity can have multiple XKTMeshes.
    // An XKTMesh can only belong to one XKTEntity.
    
    xktModel.createEntity({
      entityId: "redLeg",
      meshIds: ["redLegMesh"]
    });
    
    xktModel.createEntity({
      entityId: "greenLeg",
      meshIds: ["greenLegMesh"]
    });
    
    xktModel.createEntity({
      entityId: "blueLeg",
      meshIds: ["blueLegMesh"]
    });
    
    xktModel.createEntity({
      entityId: "yellowLeg",
      meshIds: ["yellowLegMesh"]
    });
    
    xktModel.createEntity({
      entityId: "pinkTop",
      meshIds: ["pinkTopMesh"]
    });

    Once we’ve built our XKTModel, we need to finalize it. Then it’s ready to use. Note that finalizing is an asynhronous operation, so we await its completion before continuing.

    await xktModel.finalize();

    Serializing the XKTModel to an ArrayBuffer

    Next, we’ll use writeXKTModelToArrayBuffer to serialize our XKTModel to an .ArrayBuffer

    const xktArrayBuffer = writeXKTModelToArrayBuffer(xktModel, "", {}, {zip: false});
    
    const buffer = Buffer.from(xktArrayBuffer);
    fs.writeFileSync("./myModel.xkt", buffer);

    Loading the ArrayBuffer into a Viewer

    Let’s now create a Viewer, then load the into it using an XKTLoaderPlugin .ArrayBuffer

    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    const model = xktLoader.load({
        id: "myModel",
        src: "./myModel.xkt"
    });

    Finally, when the model has loaded, let’s fit it in view.

    model.on("loaded", () => {
        viewer.cameraFlight.flyTo(model);
    });

    Loading IFC into an XKTModel

    Let’s use parseIFCIntoXKTModel to import IFC into an XKTModel.

    As before, we’ll also use the classes and functions introduced in the previous examples to serialize the XKTModel to an , then load it into a Viewer.ArrayBuffer

    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    utils.loadArraybuffer("./assets/models/ifc/rac_advanced_sample_project.ifc", async (data) => {
    
            const xktModel = new XKTModel();
    
            parseIFCIntoXKTModel({data, xktModel, wasmPath: "../dist/"}).then(() => {
    
                xktModel.finalize().then(() => {
    
                    const xktArrayBuffer = writeXKTModelToArrayBuffer(xktModel);
    
                    xktLoader.load({
                        id: "myModel",
                        xkt: xktArrayBuffer,
                        edges: true
                    });
    
                    viewer.cameraFlight.flyTo(viewer.scene);
                });
            });
        },
        (errMsg) => {
        });

    将 LAS 加载到 XKTModel 中

    让我们 使用 parseLASIntoXKTModel 将 LAS 导入 一个 XKTModel

    和以前一样,我们还将使用前面示例中介绍的类和函数进行序列化 XKTModel 到 an ,然后将其加载到 一个 ViewerArrayBuffer

    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    utils.loadArraybuffer("./assets/models/laz/indoor.0.1.laz", async (data) => {
    
            const xktModel = new XKTModel();
    
            parseLASIntoXKTModel({data, xktModel, rotateX: true}).then(() => {
    
                xktModel.finalize().then(() => {
    
                    const xktArrayBuffer = writeXKTModelToArrayBuffer(xktModel);
    
                    xktLoader.load({
                        id: "myModel",
                        xkt: xktArrayBuffer,
                        edges: true
                    });
    
                    viewer.cameraFlight.flyTo(viewer.scene);
                });
            });
        },
        (errMsg) => {
        });

    将 GLB 加载到 XKTModel 中

    让我们 使用 parseGLTFIntoXKTModel 将二进制 glTF 导入 一个 XKTModel

    我们还将使用前面示例中介绍的类和函数进行序列化 XKTModel 到 an ,然后验证并将其加载到 一个 ViewerArrayBufferArrayBuffer

    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    utils.loadArraybuffer("./assets/models/glb/MAP/MAP.glb", (glb) => {
    
            const xktModel = new XKTModel();
    
            parseGLTFIntoXKTModel({data: glb, xktModel: xktModel}).then(() => {
    
                xktModel.finalize().then(() => {
    
                    const xktArrayBuffer = writeXKTModelToArrayBuffer(xktModel);
    
                    xktLoader.load({
                        id: "myModel",
                        xkt: xktArrayBuffer
                    });
    
                    viewer.cameraFlight.flyTo(viewer.scene);
                });
            });
        },
        (errMsg) => {
        });

    将 STL 加载到 XKTModel 中

    让我们 使用 parseSTLIntoXKTModel 将 STL 导入 一个 XKTModel

    和以前一样,我们还将使用前面示例中介绍的类和函数进行序列化 XKTModel 到 an ,然后将其加载到 一个 ViewerArrayBuffer

    const viewer = new Viewer({
        canvasId: "myCanvas"
    });
    
    const xktLoader = new XKTLoaderPlugin(viewer);
    
    utils.loadArraybuffer("./assets/models/stl/binary/spurGear.stl", (json) => {
    
            const xktModel = new XKTModel();
    
            parseSTLIntoXKTModel({stlData: json, xktModel: xktModel}).then(() => {
    
                xktModel.finalize().then(() => {
    
                    const xktArrayBuffer = writeXKTModelToArrayBuffer(xktModel);
    
                    xktLoader.load({
                        id: "myModel",
                        xkt: xktArrayBuffer
                    });
    
                    viewer.cameraFlight.flyTo(viewer.scene);
                });
            });
        },
        (errMsg) => {
        });

    建筑

    构建二进制文件

    目前我们不捆绑代码。这意味着没有特殊的构建过程。 只需安装 NPM 依赖项

    npm install
    npm run build
    

    RuntimeError:内存访问越界

    幸运的是,WASM 模块已经针对您的目标 x86 系统进行了适当的编译。

    但是,如果您收到此错误:

    RuntimeError: memory access out of bounds

    然后,您需要为目标系统编译该 WASM 模块。请按照 web-ifc 项目页面上的说明进行作,然后将 ./dist/web-ifc.wasm 替换为您编译的二进制文件。

    TypeError:获取失败

    此错误可能在 nodejs 版本 17+ 中出现。作为修复,您必须将 –no-experimental-fetch 标志添加到命令中。

    node --no-experimental-fetch convert2xkt.js ...

    性能

    缓冲区压缩

    从 v1.1.25 版本开始,xeokit-convert 默认不压缩缓冲区。要保持旧行为,请使用 -b 选项:

    node convert2xkt.js -a manifest.json -o model.xkt -b

    否则,我们建议改用本机 Web 服务器/浏览器压缩 (gzip),这样效率更高。

    1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
    2. 分享目的仅供大家学习和交流,请不要用于商业用途!
    3. 如果你也有好源码或者教程,可以到用户中心发布,分享有积分奖励和额外收入!
    4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
    5. 如有链接无法下载、失效或广告,请联系管理员处理!
    6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
    7. 如遇到加密压缩包,默认解压密码为"gltf",如遇到无法解压的请联系管理员!
    8. 因为资源和程序源码均为可复制品,所以不支持任何理由的退款兑现,请斟酌后支付下载
    声明如果标题没有注明"已测试"或者"测试可用"等字样的资源源码均未经过站长测试.特别注意没有标注的源码不保证任何可用性

    GLB下载网 - GLB/GLTF模型与格式资源免费下载,支持在线浏览与转换 » 使用 xeokit 转换各种 AEC 模型格式,以便在浏览器中高效查看。

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载要提取码
    百度网盘提取码都是gltf。
    分享过期和重复下载怎么办
    分享过期请使用备份下载,重复下载是不另扣费的,请放心下载。
    模型和平台不兼容怎么办
    可以用网站在线编辑功能,修改模型属性,大小,方向,坐标,中心,透明等问题,然后重新导出既可https://glbxz.com/38636.html
    开通VIP 享更多特权,建议使用 QQ 登录