{"id":28409154,"url":"https://github.com/xeokit/xeokit-webcomponents","last_synced_at":"2025-10-08T20:03:03.957Z","repository":{"id":278742208,"uuid":"936591490","full_name":"xeokit/xeokit-webcomponents","owner":"xeokit","description":null,"archived":false,"fork":false,"pushed_at":"2025-04-17T20:29:30.000Z","size":59,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-06-02T14:19:54.320Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xeokit.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-02-21T10:51:45.000Z","updated_at":"2025-05-07T11:07:12.000Z","dependencies_parsed_at":"2025-04-17T21:45:25.744Z","dependency_job_id":"35aaa68f-c2d9-456d-9329-392ebbf5e846","html_url":"https://github.com/xeokit/xeokit-webcomponents","commit_stats":null,"previous_names":["xeokit/xeokit-webcomponents"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/xeokit/xeokit-webcomponents","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xeokit%2Fxeokit-webcomponents","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xeokit%2Fxeokit-webcomponents/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xeokit%2Fxeokit-webcomponents/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xeokit%2Fxeokit-webcomponents/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xeokit","download_url":"https://codeload.github.com/xeokit/xeokit-webcomponents/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xeokit%2Fxeokit-webcomponents/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261782304,"owners_count":23208902,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-02T05:42:46.689Z","updated_at":"2025-10-08T20:03:03.951Z","avatar_url":"https://github.com/xeokit.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# xeokit-webcomponents\n\nHow to use xeokit webcomponents: https://xeokit.io/blog/building-3d-model-viewers-with-xeokit-webcomponents\n\nExample:\n```html\n\u003cxeo-viewer id=\"viewer-1\" transparent=\"true\"\u003e\n  \u003cxeo-model src=\"https://sos-ch-gva-2.exo.io/creoox-public/example-no-1.xkt\" id=\"model-1\" bounding-box=\"true\" show-edges=\"true\"\u003e\u003c/xeo-model\u003e\n\u003c/xeo-viewer\u003e\n```\n\n## \u0026lt;xeo-viewer\u0026gt;\n*   `id`: A unique ID for the viewer instance.\n*   `transparent`: (Optional) Control the viewer background transparency (Default: false).\n*   `show-edges`: (Optional) Show edges (default false)\n*   `dtx-enabled`: (Optional) Whether data texture-based scene representation (DTX) is enabled (default false)\n*   `color-texture-enabled`: (Optional) Whether basic color texture rendering is enabled (default false)\n*   `nav-cube-enabled`: (Optional) Whether navcube plugin is enabled (default false)\n*   `nav-cube-position`: (Optional) Position of navcube (default bottom-left)\n*   `@model-entity-clicked`: (Optional) Callback function when entity was clicked (Event argument provides detail)\n\n## \u0026lt;xeo-model\u0026gt;\n*   `src`: The URL to your 3D model or data string (`data:application/octet-stream;base64,iVBORw0KGgoAAAANSUhEUgAAB9AAAAdp...`)\n      Use model type prefixes to force loader type: (available types: `gltf/glb/las/laz/obj/stl/bim/ifc`) (Example: `src=\"laz;https://localhost:3000/point-cloud-model\"`)\n*   `id`: Unique id of your model\n*   `bounding-box`: (Optional) Displays the bounding box of the loaded model. This is useful for debugging or visualizing model extents. (Default: false)\n*   `show-edges`: (Optional) Whether or not to show edges (Default: false)\n*   `dtx-enabled`: (Optional) Whether data texture scene representation (DTX) is enabled (Default: false)\n*   `color-texture-enabled`: (Optional) Whether basic color texture rendering is enabled (Default: false)\n*   `sao-enabled`: (Optional) Whether SAO (Scalable Ambient Obscurance) is enabled (Default: false)\n*   `rotation`: (Optional) Initial rotation of model (Default: [0, 0, 0])\n*   `fp64`: (Optional) Whether floating point precision for point cloud models is enabled (Default: false)\n*   `@model-loaded`: (Optional) Callback function when model was loaded (Event argument provides detail)\n\n## \u0026lt;xeo-tree-view-panel\u0026gt; \u0026lt;xeo-tree-view\u0026gt;\n*   `\u003cxeo-tree-view-panel\u003e`: A container for one or more tree views.\n    *   `width`: Sets the width of the panel.\n    *   `bgColor`: Sets the background color using an RGBA value for transparency.\n    *   `position`: Panel position, left or right side of a page. (Default: right)\n*   `\u003cxeo-tree-view\u003e`: Renders a tree view of the loaded models. You can have multiple `xeo-tree-view` elements, each displaying a different hierarchy.\n    *   `id`: Unique id of tree view\n    *   `hierarchy`: Defines the hierarchy type. Common values include:\n        *   `\"containment\"`: Based on IFC spatial containment.\n        *   `\"types\"`: Grouped by IFC types.\n        *   `\"storeys\"`: Grouped by IFC storeys.\n    *   `autoExpandDepth`: Specifies how many levels of the tree should be automatically expanded on load. (Default: 0)\n    *   `@tree-view-node-title-clicked`: (Optional) Callback function when tree view node was clicked (Event argument provides detail)\n \n## \u0026lt;xeo-fast-nav\u0026gt;\nViewer plugin that makes interaction smoother with large models, by temporarily switching the Viewer to faster, lower-quality rendering modes whenever we interact.\n* `hide-edges`: Don't show edges while we interact (Default: true) (Optional)\n* `hide-sao`:  Don't show ambient shadows while we interact (Default: true) (Optional)\n* `hide-pbr`: No physically-based rendering while we interact (Default: true) (Optional)\n* `hide-color-texture`: No color textures while we interact (Default: true) (Optional)\n* `hide-transparent-objects`: Hide transparent objects while we interact (Default: false) (Optional)\n* `scale-canvas-resolution`: Scale canvas resolution while we interact (Default: true) (Optional)\n* `scale-canvas-resolution-factor`: Factor by which we scale canvas resolution when we interact (Default: 0.8) (Optional)\n* `delay-before-restore`: When we stop interacting, delay before restoring normal render (Default: true) (Optional)\n* `delay-before-restore-seconds`: The delay duration, in seconds (Default is 0.5) (Optional)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxeokit%2Fxeokit-webcomponents","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxeokit%2Fxeokit-webcomponents","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxeokit%2Fxeokit-webcomponents/lists"}