Upgrade gemini-viewer sdk
This commit is contained in:
@ -28,14 +28,11 @@
|
||||
"title": "Doors & windows",
|
||||
"url": "./demo/dxf_2.html"
|
||||
}, {
|
||||
"title": "Drawing comparison",
|
||||
"title": "Drawing comparison with 1 viewport",
|
||||
"url": "./demo/dxf_3.html"
|
||||
}, {
|
||||
"title": "Drawing comparison with 2 viewports",
|
||||
"url": "./demo/dxf_8.html"
|
||||
}, {
|
||||
"title": "Drawing comparison with 3 viewports",
|
||||
"url": "./demo/dxf_4.html"
|
||||
}, {
|
||||
"title": "Upload files and compare with 2 viewports",
|
||||
"url": "./demo/dxf_10.html"
|
||||
|
@ -29,7 +29,7 @@ export default class DxfComparePanel {
|
||||
panelContainer.appendChild(compareDetail);
|
||||
this.compareDetail = compareDetail;
|
||||
|
||||
const changes = this.viewer.getCompareChanges();
|
||||
const changes = this.viewer.getChanges();
|
||||
if (!changes) {
|
||||
return;
|
||||
}
|
||||
@ -98,7 +98,7 @@ export default class DxfComparePanel {
|
||||
lists.forEach((list) => {
|
||||
list.addEventListener("click", (e) => {
|
||||
if (e.target.tagName.toUpperCase() === "LI" && e.target.dataset.id) {
|
||||
this.viewer.zoomToCompareChange(e.target.dataset.id);
|
||||
this.viewer.zoomToChange(e.target.dataset.id);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -102,7 +102,7 @@
|
||||
const fontFiles = ["./demo/three/fonts/hztxt.shx", "./demo/three/fonts/simplex.shx"];
|
||||
await compareHelper.setFont(fontFiles);
|
||||
|
||||
compareHelper.viewer1.toolbar.updateMenus(
|
||||
compareHelper.viewer.toolbar.updateMenus(
|
||||
overrideToolbarConfig(compareHelper.viewer1)
|
||||
);
|
||||
compareHelper.viewer2.toolbar.updateMenus(
|
||||
|
@ -20,7 +20,7 @@
|
||||
<div id="myCanvas" class="container"></div>
|
||||
</div>
|
||||
<script type="module">
|
||||
import { DxfViewer, ToolbarMenuId } from "./demo/libs/gemini-viewer.esm.min.js";
|
||||
import { BaseDxfCompareHelper, DxfViewer, ToolbarMenuId } from "./demo/libs/gemini-viewer.esm.min.js";
|
||||
import DxfComparePanel from "./demo/compare/dxfComparePanel.js"
|
||||
import DxfSettingsPanel from "./demo/settings/DxfSettingsPanel.js";
|
||||
import LayerManager from "./demo/layerManager/LayerManager.js";
|
||||
@ -39,14 +39,14 @@
|
||||
onActive: () => {
|
||||
console.log("[Toolbar]", "Activate Settings");
|
||||
if (!window.dxfSettingsPanel) {
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.viewer);
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.compareHelper.viewer);
|
||||
}
|
||||
window.dxfSettingsPanel.show();
|
||||
},
|
||||
onDeactive: () => {
|
||||
console.log("[Toolbar]", "Deactivate Settings");
|
||||
if (!window.dxfSettingsPanel) {
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.viewer);
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.compareHelper.viewer);
|
||||
}
|
||||
window.dxfSettingsPanel.hide();
|
||||
},
|
||||
@ -55,31 +55,31 @@
|
||||
onActive: () => {
|
||||
console.log("[Toolbar]", "Activate Layers");
|
||||
if (!window.layerManager) {
|
||||
window.layerManager = new LayerManager(window.viewer);
|
||||
window.layerManager = new LayerManager(window.compareHelper.viewer);
|
||||
}
|
||||
window.layerManager.show();
|
||||
},
|
||||
onDeactive: () => {
|
||||
console.log("[Toolbar]", "Deactivate Layers");
|
||||
if (!window.layerManager) {
|
||||
window.layerManager = new LayerManager(window.viewer);
|
||||
window.layerManager = new LayerManager(window.compareHelper.viewer);
|
||||
}
|
||||
window.layerManager.hide();
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
const viewer = new DxfViewer(config);
|
||||
const compareHelper = new BaseDxfCompareHelper(config);
|
||||
// const fontFiles = ["./demo/three/fonts/Microsoft_YaHei_Regular.typeface.json"];
|
||||
const fontFiles = ["./demo/three/fonts/hztxt.shx", "./demo/three/fonts/simplex.shx"];
|
||||
await viewer.setFont(fontFiles);
|
||||
window.viewer = viewer;
|
||||
await compareHelper.setFont(fontFiles);
|
||||
window.compareHelper = compareHelper;
|
||||
|
||||
const onProgress = (event) => {
|
||||
const progress = ((event.loaded * 100) / event.total).toFixed(1);
|
||||
console.log(`[Demo] Loading progress: ${progress}%`);
|
||||
};
|
||||
await viewer.compare({src: url1, modelId: "doors_and_windows.dxf"}, {src: url2, modelId: "doors_and_windows_mopdified.dxf"}, onProgress).then(() => {
|
||||
await compareHelper.compare({src: url1, modelId: "doors_and_windows.dxf"}, {src: url2, modelId: "doors_and_windows_mopdified.dxf"}, onProgress).then(() => {
|
||||
console.log(`[Demo] Compared models: ${url1}, ${url2}`);
|
||||
});
|
||||
|
||||
|
@ -1,142 +0,0 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<link rel="icon" href="./demo/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="./demo/global.css" />
|
||||
<link rel="stylesheet" type="text/css" href="./demo/iconfont/iconfont.css" />
|
||||
<link rel="stylesheet" href="./demo/compare/dxfComparePanel.css" />
|
||||
<link rel="stylesheet" href="./demo/layerManager/layerManager.css" />
|
||||
<link rel="stylesheet" href="./demo/settings/SettingsPanel.css" />
|
||||
<style>
|
||||
#myCanvas1 {
|
||||
width: 40%;
|
||||
height: 50%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
border: 1px #dddddd solid;
|
||||
}
|
||||
#myCanvas2 {
|
||||
width: 40%;
|
||||
top: 50% !important;
|
||||
height: 50%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
border: 1px #dddddd solid;
|
||||
}
|
||||
#myCanvas3 {
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
border: 1px #dddddd solid;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
margin-top: 8px;
|
||||
color: white;
|
||||
top: 0%;
|
||||
left: 18%;
|
||||
}
|
||||
.title2 {
|
||||
top: 50%;
|
||||
left: 18%;
|
||||
}
|
||||
.title3 {
|
||||
left: 68%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<span class="title">File 1</span>
|
||||
<div id="myCanvas1" class="container"></div>
|
||||
<span class="title title2">File 2</span>
|
||||
<div id="myCanvas2" class="container"></div>
|
||||
<span class="title title3">Comparison result</span>
|
||||
<!-- myCanvas3 is the one for compare -->
|
||||
<div id="myCanvas3" class="container"></div>
|
||||
</div>
|
||||
<script type="module">
|
||||
import { DxfViewer, ToolbarMenuId } from "./demo/libs/gemini-viewer.esm.min.js";
|
||||
import DxfComparePanel from "./demo/compare/dxfComparePanel.js"
|
||||
import DxfSettingsPanel from "./demo/settings/DxfSettingsPanel.js";
|
||||
import LayerManager from "./demo/layerManager/LayerManager.js";
|
||||
|
||||
const url1 = "./demo/models/dxf/doors_and_windows.dxf";
|
||||
const url2 = "./demo/models/dxf/doors_and_windows_mopdified.dxf";
|
||||
const modelConfig1 = { modelId: "doors_and_windows", name: "dxf 1", src: url1, ignorePaperSpace: true };
|
||||
const modelConfig2 = { modelId: "doors_and_windows_mopdified", name: "dxf 2", src: url2, ignorePaperSpace: true };
|
||||
const config = {
|
||||
containerId: "myCanvas3",
|
||||
enableAxisGizmo: true,
|
||||
enableToolbar: true,
|
||||
enableSpinner: true,
|
||||
enableProgressBar: true,
|
||||
enableLayoutBar: true,
|
||||
toolbarMenuConfig: {
|
||||
[ToolbarMenuId.Settings]: {
|
||||
onActive: () => {
|
||||
console.log("[Toolbar]", "Activate Settings");
|
||||
if (!window.dxfSettingsPanel) {
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.viewer);
|
||||
}
|
||||
window.dxfSettingsPanel.show();
|
||||
},
|
||||
onDeactive: () => {
|
||||
console.log("[Toolbar]", "Deactivate Settings");
|
||||
if (!window.dxfSettingsPanel) {
|
||||
window.dxfSettingsPanel = new DxfSettingsPanel(window.viewer);
|
||||
}
|
||||
window.dxfSettingsPanel.hide();
|
||||
},
|
||||
},
|
||||
[ToolbarMenuId.Layers]: {
|
||||
onActive: () => {
|
||||
console.log("[Toolbar]", "Activate Layers");
|
||||
if (!window.layerManager) {
|
||||
window.layerManager = new LayerManager(window.viewer);
|
||||
}
|
||||
window.layerManager.show();
|
||||
},
|
||||
onDeactive: () => {
|
||||
console.log("[Toolbar]", "Deactivate Layers");
|
||||
if (!window.layerManager) {
|
||||
window.layerManager = new LayerManager(window.viewer);
|
||||
}
|
||||
window.layerManager.hide();
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
const viewer1 = new DxfViewer({ containerId: "myCanvas1"});
|
||||
const viewer2 = new DxfViewer({ containerId: "myCanvas2"});
|
||||
const viewer3 = new DxfViewer(config);
|
||||
const fontFiles = ["./demo/three/fonts/hztxt.shx", "./demo/three/fonts/simplex.shx"];
|
||||
await viewer1.setFont(fontFiles);
|
||||
await viewer2.setFont(fontFiles);
|
||||
await viewer3.setFont(fontFiles);
|
||||
|
||||
window.viewer = viewer3;
|
||||
|
||||
const onProgress = (event) => {
|
||||
const progress = ((event.loaded * 100) / event.total).toFixed(1);
|
||||
console.log(`[Demo] Loading progress: ${progress}%`);
|
||||
};
|
||||
await viewer1.loadModelAsync(modelConfig1, onProgress);
|
||||
await viewer2.loadModelAsync(modelConfig2, onProgress);
|
||||
await viewer3.compare(modelConfig1, modelConfig2, onProgress).then(() => {
|
||||
console.log(`[Demo] Compared models: ${url1}, ${url2}`);
|
||||
if (!viewer.dxfComparePanel) {
|
||||
viewer.dxfComparePanel = new DxfComparePanel(viewer);
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
@ -86,7 +86,7 @@
|
||||
const fontFiles = ["./demo/three/fonts/hztxt.shx", "./demo/three/fonts/simplex.shx"];
|
||||
await compareHelper.setFont(fontFiles);
|
||||
|
||||
compareHelper.viewer1.toolbar?.updateMenus(
|
||||
compareHelper.viewer.toolbar?.updateMenus(
|
||||
overrideToolbarConfig(compareHelper.viewer1)
|
||||
);
|
||||
compareHelper.viewer2.toolbar?.updateMenus(
|
||||
|
Reference in New Issue
Block a user