Validate with IDS

This sample loads rac_advanced_sample_project.ifc from GitHub, reads a buildingSMART sample IDS XML file from GitHub, and passes the IDS data to the viewer validation panel. Load the IFC model first, then pass valid IDS XML that matches the model schema.

Preview
Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <style>
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { height: 100vh; display: flex; flex-direction: column; }
    bim-grid { flex: 1; }
  </style>
</head>
<body>

  <bim-grid id="ifc-viewer"></bim-grid>

  <script type="module">
    import { IfcViewer } from "https://cdn.flinker.app/ifc-viewer/v3.2.0/ifc-viewer.es.js";

    const viewer = new IfcViewer("#ifc-viewer");
    await viewer.ready;

    const ifcUrl = "https://raw.githubusercontent.com/mrdoob/three.js/dev/examples/models/ifc/rac_advanced_sample_project.ifc";
    const ifcBytes = new Uint8Array(await (await fetch(ifcUrl)).arrayBuffer());
    await viewer.add("rac_advanced_sample_project.ifc", ifcBytes);

    const idsUrl = "https://raw.githubusercontent.com/buildingSMART/IDS/development/Documentation/Examples/IDS_random_example.ids";
    const idsText = await (await fetch(idsUrl)).text();
    window.dispatchEvent(new CustomEvent("idsLoadEvent", {
      detail: { name: "loadIDS", payload: { data: idsText } }
    }));
  </script>

</body>
</html>

Table of Contents

Validate with IDS