IFC Viewer Online cho mô hình BIM
TSVIDEV chuyển IFC thành dữ liệu ThatOpen Fragments có thể phân trang và render trên Three.js, cho phép xem mô hình BIM trực tiếp trên trình duyệt không cần phần mềm desktop.
Xem Demo trực tiếp ↓Công nghệ cốt lõi
Three.js
Engine render 3D mã nguồn mở — hiển thị mô hình IFC đã chuyển đổi với chất lượng cao.
ThatOpen Fragments
Engine BIM phân mảnh và streaming hình học, màu sắc cùng metadata IFC trên web.
WebGL
Render phần cứng trên trình duyệt — xem mô hình BIM phức tạp không cần cài phần mềm.
Trải nghiệm trên trình duyệt
Xem mô hình 3D
Xoay, phóng to, cắt lát mô hình IFC trực tiếp trên trình duyệt.
Duyệt cấu trúc BIM
Layer tree hiển thị cấu trúc mô hình — bật tắt từng tầng, hệ thống.
Xem thuộc tính IFC
Click vào cấu kiện để xem metadata — tên, loại, vật liệu, kích thước.
Demo trực tiếp
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/OrbitControls.js';
const scene = new THREE.Scene();
const renderer = new THREE.WebGLRenderer({ antialias: true });
const camera = new THREE.PerspectiveCamera(45, w / h, 0.1, 1000);
const controls = new OrbitControls(camera, renderer.domElement);
import { FragmentsModels } from '@thatopen/fragments';
import fragmentsWorkerUrl from '@thatopen/fragments/worker?url';
const fragments = new FragmentsModels(fragmentsWorkerUrl);
const bytes = new Uint8Array(
await fetch('/models/building.frag').then(res => res.arrayBuffer())
);
const model = await fragments.load(bytes, { modelId: 'building', camera });
scene.add(model.object);
// Inspect IFC properties on click
canvas.addEventListener('click', (e) => {
const hit = await model.raycast({ camera, mouse, dom: renderer.domElement });
if (hit) showPanel(await model.getItemsData([hit.localId]));
});
Bạn có thể xoay, phóng to và tương tác trực tiếp với mô hình trên trình duyệt.
Tính năng hỗ trợ
Dữ liệu phù hợp
Tình huống sử dụng
Câu hỏi thường gặp
Tìm hiểu thêm về TSVIDEV
Truy cập trang chủ để xem các dự án và tính năng mới nhất.
Về trang chủ TSVIDEV