<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
.action-panel {
position: fixed;
bottom: 5px;
margin-left: 0px;
left: calc(50% - 80px);
background: #f9f9f9;
border: 1px solid #ededed;
box-sizing: border-box;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
z-index: 2000;
}
.select-panel {
position: fixed;
top: 5px;
margin-left: 0px;
left: 80px;
background: #f9f9f9;
border: 1px solid #ededed;
box-sizing: border-box;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
z-index: 2000;
}
.active {
border: 2px solid #666666;
}
.action-item {
padding-left: 10px;
padding-right: 10px;
align-items: center;
text-align: center;
float: left;
cursor: pointer;
border: none;
font-size: 1em;
height: 41px;
user-select: none;
}
.action-item-text {
text-align: center;
position: relative;
bottom: 11px;
font-size: 1em;
user-select: none;
}
.action-item:active {
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
border: none;
}
</style>
</head>
<div class="loader">
<div></div>
<span>Loading...</span>
</div>
<canvas
id="canvas"
style="position: absolute; width: 100%; height: 100vh; top: 0; left: 0"
></canvas>
<!-- 引用刚才生成的example.js文件 -->
<script src="Visualize.js"></script>
<script src="OdaViewerPlugin.js"></script>
<script>
var options = {
urlMemFile: 'Visualize.js.wasm',
TOTAL_MEMORY: 20971520
}
const lib = getVisualizeLibInst(options)
var view = null
var relDic = new Array()
var unfindFlag = -9999
lib.addOnPostRun(() => {
document.querySelector('.loader').style.display = 'none'
const canvas = document.getElementById('canvas')
canvas.height = canvas.clientHeight
canvas.width = canvas.clientWidth
lib.canvas = canvas
lib.Viewer.initRender(canvas.width, canvas.height, true)
const viewer = lib.Viewer.create()
view = viewer
function resize() {
canvas.height = canvas.clientHeight
canvas.width = canvas.clientWidth
viewer.resize(0, canvas.width, canvas.height, 0)
viewer.update()
}
resize()
window.addEventListener('resize', resize)
var plugin = new OdaViewerPlugin(lib)
plugin.setActive(plugin.type.Pan)
plugin.setAutoSelect(true)
//选择事件;
plugin.onmessage = (event) => {
if (event.type === 'select') {
const sSet = event.data
const itr = sSet.getIterator()
if (!itr.done()) {
const entityId = itr.getEntity()
let handle = -1
if (entityId.getType() === 1) {
handle = entityId.openObject().getDatabaseHandle()
console.log('aaaa', handle)
} else if (entityId.getType() === 2) {
handle = entityId.openObjectAsInsert().getHandle()
console.log('bbbb', handle)
}
}
}
}
fetch('11.vsf')
.then((responce) => responce.arrayBuffer())
.then((arrayBuffer) => {
// disable loader
document.querySelector('.loader').style.display = 'none'
// clear buffer
viewer.clear()
// pass file as Uint8Array to the viewer for parsing
viewer.parseFile(new Uint8Array(arrayBuffer))
// call zoomExtenst method in case the camera is not aimed at the whole scene by default
viewer.zoomExtents()
})
function render() {
viewer.update()
requestAnimationFrame(render)
}
render()
})
function showlayers() {
var iter = view.getLayersIterator()
console.log('layers begin')
for (; !iter.done(); iter.step()) {
var layer_id = iter.getLayer()
if (layer_id == null) {
console.log('layer end')
return
}
var layer = layer_id.openObject()
if (layer == null) {
return
}
console.log(layer.getName())
}
console.log('layers end')
}
function getRelDic() {
var iter = view.getActiveModel().getEntitiesIterator()
for (; !iter.done(); iter.step()) {
var entity_id = iter.getEntity()
if (entity_id.isNull()) {
console.log('blocks end')
return
}
try {
var handle = null,
nativeHandle = null
if (entity_id.getType() === 1) {
var entity = entity_id.openObject()
handle = entity.getDatabaseHandle()
nativeHandle = entity.getNativeDatabaseHandle()
} else if (entity_id.getType() === 2) {
var insert = entity_id.openObjectAsInsert()
handle = insert.getHandle()
nativeHandle = insert.getNativeDatabaseHandle()
} else {
continue
}
if (handle == null || nativeHandle == null) {
continue
}
relDic[nativeHandle] = handle
} catch (error) {
console.log(entity_id)
}
console.log('ttt', relDic)
}
}
function zoomToSeclect(obj) {
var index = obj.selectedIndex
var cadHandle = obj.options[index].text
//代表的是选中项的的值
var handle = obj.options[index].value
if (unfindFlag == handle) {
alert('无法找到句柄为【' + cadHandle + '】的图元')
return
}
var entityId = view.getActiveModel().findEntity(handle)
view.setSelectedEntity(entityId)
view.zoomToEntity(entityId)
add(entityId)
}
function initRelInfo() {
// var cadOutHandle='888888;616;615;614;613;612;611;610;609;608;607;606;605;8888';
var cadOutHandle =
'2400651;2400650;2400649;2393713;2393712;2393711;2393708;2393707;2393706;2393705;2393704;2393698;2393697;2393696;2393695;2393694;2393693;2393692;2393691;2393690;2393689;2393688;2393677;2393676;2393675;2393674;2393673;2393672;2393671;2393670;2393669;2393668;2393667;2393666;2393665;2393664;2393663;2386340;2386339;2386338;2386337;2386336;2386335;2386334;2386333;2386332;2386330;2386329;2386328;2386327;2386326;1955819;1955818;1927196;1927195;1927194;1927193;1927190;1927189;1927188;1927187;1927186;1927185;1927184;1927183;1927182;1927181;1927180;1927179;1927178;1927177;1927176;1927175;1927174;1927173;1340718;1340717;1340716;1340628;1340624;1340623;1340622;1340621;1340620;1340619;1340618;1340617;1340616;1340615;1340614;1340613;1340612;1340611;1215591;1215590;1215589;1215588;1215587;1215586;1215585;1215584;1215583;1215574;1215573;1215572;1215571;1215570;1215569;1215568;1215567;1215566;1215420;1215418;1215416;1215414;1215412;1215408;1215406;1215404;1215402;1215398;1215396;1215394;1215392;1215390;1215388;1215386;1215384;1215382;1215380;1215378;1215376;1215374;1215372;1215370;1215368;1215366;1215364;1215362;1215360;1215358;1215356;1215354;1215352;1215350;1215348;1215346;1215344;1215342;1215340;1215338;1215336;1215334;1215332;1215330;1215328;1215326;1215324'
getRelDic()
var selectBox = document.getElementById('jcp')
cadOutHandle.split(';').forEach((h) => {
var handle = relDic[h]
if (handle == null) {
handle = unfindFlag
}
selectBox.add(new Option(h, handle))
})
}
function add(entityId) {
const model = view.getActiveModel()
const overContPtr = mo