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

Merge pull request #81 from pattern-x/feature/3d-with-2d

Browse Source 
Add one more example for overlaying 3d model with 2d dxf
This commit is contained in:
pattern-x
2023-04-20 13:33:02 +00:00
parent f83b5f7289
commit aa79ebc318
16 changed files with 229206 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
asset-manifest.json
View File

@ -1,7 +1,7 @@
{
"files": {
"main.css": "./static/css/main.384d9665.css",
"main.js": "./static/js/main.349699b7.js",
"main.css": "./static/css/main.c5d00445.css",
"main.js": "./static/js/main.0b135014.js",
"static/js/787.cf5efa72.chunk.js": "./static/js/787.cf5efa72.chunk.js",
"demo/libs/gemini-viewer.esm.min.js": "./demo/libs/gemini-viewer.esm.min.js",
"static/media/dwg_background.png": "./static/media/dwg_background.f630e7cda68e19172eec.png",
@ -254,12 +254,12 @@
"demo/libs/types/core/webcam/index.d.ts": "./demo/libs/types/core/webcam/index.d.ts",
"demo/libs/types/core/workers/CreateEdgesGeometry.worker.d.ts": "./demo/libs/types/core/workers/CreateEdgesGeometry.worker.d.ts",
"demo/libs/types/core/workers/CreateMeshBvh.worker.d.ts": "./demo/libs/types/core/workers/CreateMeshBvh.worker.d.ts",
"main.384d9665.css.map": "./static/css/main.384d9665.css.map",
"main.349699b7.js.map": "./static/js/main.349699b7.js.map",
"main.c5d00445.css.map": "./static/css/main.c5d00445.css.map",
"main.0b135014.js.map": "./static/js/main.0b135014.js.map",
"787.cf5efa72.chunk.js.map": "./static/js/787.cf5efa72.chunk.js.map"
},
"entrypoints": [
"static/css/main.384d9665.css",
"static/js/main.349699b7.js"
"static/css/main.c5d00445.css",
"static/js/main.0b135014.js"
]
}

3
config.json
View File

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

86
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>

BIN
demo/images/snapshots/overlay_3d_model_with_dxf.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.3 MiB

2
demo/libs/gemini-viewer.esm.min.js vendored
View File

File diff suppressed because one or more lines are too long

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

File diff suppressed because it is too large Load Diff

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

File diff suppressed because one or more lines are too long

2
index.html
View File

@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><title>React App</title><script defer="defer" src="./static/js/main.349699b7.js"></script><link href="./static/css/main.384d9665.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><title>React App</title><script defer="defer" src="./static/js/main.0b135014.js"></script><link href="./static/css/main.c5d00445.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

12
static/css/main.384d9665.css
View File

File diff suppressed because one or more lines are too long

1
static/css/main.384d9665.css.map
View File

File diff suppressed because one or more lines are too long

12
static/css/main.c5d00445.css Normal file
View File

File diff suppressed because one or more lines are too long

1
static/css/main.c5d00445.css.map Normal file
View File

File diff suppressed because one or more lines are too long

2
static/js/main.0b135014.js Normal file
View File

File diff suppressed because one or more lines are too long

1
static/js/main.0b135014.js.map Normal file
View File

File diff suppressed because one or more lines are too long

2
static/js/main.349699b7.js
View File

File diff suppressed because one or more lines are too long

1
static/js/main.349699b7.js.map
View File

File diff suppressed because one or more lines are too long