{"id":13470387,"url":"https://github.com/ThatOpen/web-ifc-viewer","last_synced_at":"2025-03-26T11:31:32.420Z","repository":{"id":37263993,"uuid":"307094465","full_name":"ThatOpen/web-ifc-viewer","owner":"ThatOpen","description":"Graphics engine and toolkit for client applications.","archived":false,"fork":false,"pushed_at":"2023-09-29T13:18:30.000Z","size":53908,"stargazers_count":965,"open_issues_count":55,"forks_count":241,"subscribers_count":46,"default_branch":"master","last_synced_at":"2025-03-20T04:14:22.185Z","etag":null,"topics":["3d","bim","geometry","ifc","threejs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ThatOpen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2020-10-25T12:31:06.000Z","updated_at":"2025-03-18T02:31:55.000Z","dependencies_parsed_at":"2023-10-05T07:16:07.176Z","dependency_job_id":null,"html_url":"https://github.com/ThatOpen/web-ifc-viewer","commit_stats":{"total_commits":525,"total_committers":28,"mean_commits":18.75,"dds":"0.24571428571428566","last_synced_commit":"1f5c975ad6d019e7355c8759369f318f9fa3e339"},"previous_names":["agviegas/ifc.js","thatopen/web-ifc-viewer","ifcjs/web-ifc-viewer"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThatOpen%2Fweb-ifc-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThatOpen%2Fweb-ifc-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThatOpen%2Fweb-ifc-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThatOpen%2Fweb-ifc-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ThatOpen","download_url":"https://codeload.github.com/ThatOpen/web-ifc-viewer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245379141,"owners_count":20605592,"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":["3d","bim","geometry","ifc","threejs"],"created_at":"2024-07-31T16:00:29.541Z","updated_at":"2025-03-26T11:31:32.368Z","avatar_url":"https://github.com/ThatOpen.png","language":"JavaScript","readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://ifcjs.github.io/info/\"\u003eifc.js\u003c/a\u003e\n  |\n  \u003ca href=\"https://ifcjs.github.io/info/docs/Guide/web-ifc-viewer/Introduction\"\u003edocumentation\u003c/a\u003e\n  |\n  \u003ca href=\"https://ifcjs.github.io/web-ifc-viewer/example/index\"\u003edemo\u003c/a\u003e\n  |\n  \u003ca href=\"https://discord.gg/FXfyR4XrKT\"\u003ediscord\u003c/a\u003e\n  |\n  \u003ca href=\"https://github.com/IFCjs/web-ifc-viewer/tree/master/example\"\u003eusage example\u003c/a\u003e\n  |\n  \u003ca href=\"https://www.npmjs.com/package/web-ifc-viewer\"\u003enpm package\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cimg src=\"banner.png\"\u003e\n\n\u003ch1\u003eTHIS LIBRARY IS DEPRECATED. USE \u003ca href=\"https://github.com/ifcjs/components\"\u003eCOMPONENTS\u003c/a\u003e INSTEAD\u003c/h1\u003e\n\n\u003ch1\u003eweb-ifc-viewer \u003cimg src=\"https://ifcjs.github.io/info/img/logo.svg\" width=\"32\"\u003e\u003c/h1\u003e\n\n![npm](https://img.shields.io/npm/dw/web-ifc-viewer)\n![opencollective](https://opencollective.com/ifcjs/tiers/badge.svg)\n\nThis library is an extension of [web-ifc-three](https://github.com/IFCjs/web-ifc-three), which is the official `IFCLoader` for [THREE.js](https://github.com/mrdoob/three.js/). This doesn't only parse and generate the Three.js geometry of IFC models in JavaScript, but also provides multiple tools to easily build BIM tools, such as 3d dimensions, clipping planes, 2D plan navigation and generation, etc.\n\n## Status\n\n**web-ifc-viewer** offers multiple tools to create awesome BIM tools in no time. While the tools are quite stable, the state of this repository is tightly coupled with the state of [web-ifc-three](https://github.com/IFCjs/web-ifc-three) and [web-ifc](https://github.com/tomvandig/web-ifc). \n\nCheck out their `README` files to better understand where the project currently is.\n\n## Demo \n\nTest IFC.js Web IFCviewer with your IFC models in our [online Demo](https://ifcjs.github.io/web-ifc-viewer/example/index)\n\n## Documentation\n\nCheck out [our official docs](https://github.com/IFCjs/web-ifc-viewer/blob/master/CONTRIBUTING.md) for API reference, guides and tutorials.\n\n## Install\n\n`npm install web-ifc-viewer` or `yarn add web-ifc-viewer`\n\n## Quick setup\n\nFirst, create a JavaScript file that imports the library and creates a scene:\n\n```js\nimport { IfcViewerAPI } from 'web-ifc-viewer';\n\nconst container = document.getElementById('viewer-container');\nconst viewer = new IfcViewerAPI({ container });\nviewer.axes.setAxes();\nviewer.grid.setGrid();\n\nconst input = document.getElementById(\"file-input\");\n\ninput.addEventListener(\"change\",\n\n  async (changed) =\u003e {\n   \n    const file = changed.target.files[0];\n    const ifcURL = URL.createObjectURL(file);\n    viewer.IFC.loadIfcUrl(ifcURL);\n  },\n\n  false\n);\n```\n\nYou can bundle this file using any bundler. This is an example configuration file using [rollup](https://rollupjs.org/guide/en/):\n\n```js\nimport resolve from '@rollup/plugin-node-resolve';\n\nexport default {\n  input: 'index.js',\n  output: {\n    file: \"bundle.js\",\n    format: 'esm'\n  },\n  plugins: [ resolve() ]\n};\n```\n\nNow you display it in an HTML page like this:\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n  \u003chead\u003e\n    \u003cmeta charset=\"UTF-8\" /\u003e\n    \u003cmeta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" /\u003e\n    \u003clink rel=\"icon\" type=\"image/png\" href=\"./favicon.ico\" /\u003e\n    \u003clink rel=\"preconnect\" href=\"https://fonts.gstatic.com\" /\u003e\n    \u003clink href=\"https://fonts.googleapis.com/css2?family=Roboto\u0026display=swap\" rel=\"stylesheet\" /\u003e\n    \u003clink rel=\"stylesheet\" type=\"text/css\" href=\"./styles.css\" /\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" /\u003e\n    \u003ctitle\u003eIFC.js\u003c/title\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003cinput type=\"file\" id=\"file-input\" accept=\".ifc, .ifcXML, .ifcZIP\"\u003e\n    \u003cdiv id=\"viewer-container\"\u003e\u003c/div\u003e\n    \u003cscript src=\"./bundle.js\"\u003e\u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Content\n\nThis project consists of the following folders:\n\n- **viewer**: contains the source code.\n\n- **example**: contains one example of how to use the library.\n\n## Contributing\n\nWant to help out? Great!\n\nPlease checkout [our contribution suggestsions](https://github.com/IFCjs/web-ifc-viewer/blob/master/CONTRIBUTING.md) or speak to us directly in [Discord](https://discord.gg/FXfyR4XrKT).\n\n\n","funding_links":[],"categories":["BIM Library"],"sub_categories":["JavaScript"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FThatOpen%2Fweb-ifc-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FThatOpen%2Fweb-ifc-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FThatOpen%2Fweb-ifc-viewer/lists"}