ByoungSooPark/gemini-viewer-examples
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add one more example for overlaying 3d model with 2d dxf

Browse Source
This commit is contained in:
yanzexuan
2023-04-20 20:39:12 +08:00
parent 52def82d86
commit bff41a987f
4 changed files with 229182 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/config.json
View File

@ -9,6 +9,9 @@
}, { }, {
"title": "Duplex", "title": "Duplex",
"url": "./demo/bim_1.html" "url": "./demo/bim_1.html"
}, {
"title": "Overlay 3d model with dxf",
"url": "./demo/bim_2_overlay_with_dxf.html"
}] }]
}, { }, {
"title": "2D drawings", "title": "2D drawings",

86
public/demo/bim_2_overlay_with_dxf.html Normal file
View File

@ -0,0 +1,86 @@
<html>
<head>
<link rel="icon" href="./demo/favicon.ico">
<link rel="stylesheet" type="text/css" href="./demo/global.css">
<!-- <style>
#myCanvas {
position: absolute;
width: calc(100% - 100px);
width: -moz-calc(100% - 100px);
width: -webkit-calc(100% - 100px);
height: calc(100% - 80px);
height: -moz-calc(100% - 80px);
height: -webkit-calc(100vh - 80px);
left: 50px;
top: 40px;
}
</style> -->
</head>
<body>
<div id="app">
<div id="myCanvas" class="container"></div>
</div>
<script type="module">
import { BimViewer, ToolbarMenuId } from "./demo/libs/gemini-viewer.esm.min.js";
const project = {
"id": "building1",
"name": "building1",
"models": [{
"name": "building1",
"src": "./demo/models/gltf/building1.gltf",
"edges": true,
"visible": true
}, {
"id": "building1_dxf",
"name": "building1 plan drawing",
"src": "./demo/models/dxf/building1.dxf",
"matrix": [
0.001, 0, 0, 0, // the dxf is in "mm", and gltf is in "meter", so need to set scale 0.001
0, 0, -0.001, 0,
0, 0.001, 0, 0,
-1831.340, 17, 456.910, 1 // also need to consider the base point
],
"edges": true,
"visible": true
}]
}
const viewer = new BimViewer({
containerId: "myCanvas",
}, project.camera);
const toolbar = viewer.toolbar;
toolbar.updateMenu(ToolbarMenuId.BimTree, { visible: false });
// font file is needed for loading dxf
// const fontFiles = ["three/fonts/Microsoft_YaHei_Regular.typeface.json"];
const fontFiles = ["three/fonts/hztxt.shx", "three/fonts/simplex.shx"];
await viewer.setFont(fontFiles);
// draco decoder path is needed to load draco encoded models.
// gemini-viewer js sdk user maintains draco decoder code somewhere, and provides the path here.
const decoderPath = "demo/three/js/libs/draco/gltf/";
viewer.setDracoDecoderPath(decoderPath);
// loadProjectModel
let counter = 0; // to indicate how many models are loading
project.models.forEach((modelCfg) => {
if (modelCfg.visible === false) {
// visible is true by default
return; // only load visible ones
}
counter++;
viewer.loadModel(modelCfg, (event) => {
console.log(`[Demo] Loading model ${modelCfg.src}`);
}, (event) => {
console.error("[Demo] Failed to load " + modelCfg.src + ". " + event.message);
}).then(() => {
console.log(`[Demo] Loaded model ${modelCfg.src}`);
viewer.setToOrthographicCamera(false);
});
});
</script>
</body>
</html>

229092
public/demo/models/dxf/building1.dxf Normal file
View File

File diff suppressed because it is too large Load Diff

1
public/demo/models/gltf/building1.gltf Normal file
View File

File diff suppressed because one or more lines are too long