jiangyq
/
YZProjectCloud
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

客户端剖切

dev_xd
lijun 2025-09-09 23:24:37 +08:00
parent 16ee38fac5
commit 7d2692dc44
3 changed files with 144 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
yanzhu-bigscreen/src/views/bim/bimTools.js
View File

@ -112,6 +112,67 @@ function initSAPIEngine(apiID, elId, bimCfg, cb) {
);
}
function loadClipModel(api, bimCfg, modelList, cb) {
let allHideParts = [];
let cnt = 0;
if (modelList && modelList.length > 0) {
modelList.forEach((it) => {
addClipModel(
api,
bimCfg,
it.modelId,
(hideParts) => {
allHideParts.push(...hideParts);
cnt++;
if (cnt == modelList.length) {
cb && cb(allHideParts);
}
},
modelList
);
});
}
}
function addClipModel(api, bimCfg, modelId, cb, models) {
let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
let direction = null;
let modelInfo = null;
if (models) {
modelInfo = models.find((m) => m.modelId == modelId);
}
if (bimCfg.clientApi) {
url = `/bimdata/Tools/output/model/${modelId}/root.glt`;
if (modelInfo) {
//direction = modelInfo.bimCfg.direction;
}
}
console.log("加载模型：" + url);
api.Model.add(
url,
"clip"+modelId,
() => {
console.log("加载模型成功2");
},
() => {
console.log("加载模型成功");
let hideParts = [];
if (modelInfo) {
let cfg = modelInfo.bimCfg;
if (cfg && cfg.hideParts) {
cfg.hideParts.forEach((it) => {
hideParts.push({
featureId:"clip"+it.featureId
});
});
}
}
api.Model.setVisible("clip"+modelId, false);
cb && cb(hideParts);
},
direction
);
}
function addModelList(api, bimCfg, modelList, cb) {
let allHideParts = [];
let cnt = 0;
@ -451,5 +512,6 @@ export default {
hideParts,
addModelList,
initIdleDetection,
destroyRouter
destroyRouter,
loadClipModel
};

24
yanzhu-bigscreen/src/views/bim/briefingTools.js
View File

@ -301,15 +301,35 @@ function getModels(that) {
function closeClientClipping(that) {
let api = bimBriefingApi;
if (that.clipState && that.clip) {
that.models.forEach(it => {
api.Model.setVisible(it.modelId, true);
api.Model.setVisible("clip" + it.modelId, false);
});
if (that.bimCfg.showGis) {
api.Public.setGisState(true);
api.viewer.terrainProvider = Cesium.createWorldTerrain({
requestVertexNormals: true, //开启地形光照
requestWaterMask: true, // 开启水面波纹
});
}
that.clipState = false;
that.clip.remove(123456);
that.clip = null;
that.resetScene();
}
}
//剖切 -- 客户端渲染
function initClientClipping(that) {
let api = bimBriefingApi;
let models = that.models.map((it) => it.modelId);
that.models.forEach(it => {
api.Model.setVisible(it.modelId, false);
api.Model.setVisible("clip" + it.modelId, true);
});
if (that.bimCfg.showGis) {
api.Public.setGisState(false)
}
let models = that.models.map((it) => "clip" + it.modelId);
api.Model.location(models[0]);
closeClientClipping(that);
that.$message.info("鼠标左键点击轴线进行操作!");
that.clipState = true;
@ -333,11 +353,13 @@ function initClientClipping(that) {
}
//剖切 -- 服务端渲染
function initClipping(that) {
console.log("---->initClipping")
let api = bimBriefingApi;
api.Public.clearHandler();
api.Measurement.clearAllTrace();
if (that.isClient) {
initClientClipping(that);
//that.clipShow();
return;
}
api.Model.clipByBox(getModels(that));

197
yanzhu-bigscreen/src/views/bimBriefing.vue
View File

@ -12,30 +12,15 @@
模型结构树
</div>
<div class="model-tree scroll">
<el-tree
:key="treeKey"
ref="tree"
:default-expanded-keys="treeExpendedKeys"
:props="{
<el-tree :key="treeKey" ref="tree" :default-expanded-keys="treeExpendedKeys" :props="{
children: 'children',
label: 'title',
}"
node-key="key"
@check="onCheckTree"
:load="loadNode"
lazy
show-checkbox
></el-tree>
}" node-key="key" @check="onCheckTree" :load="loadNode" lazy show-checkbox></el-tree>
</div>
</div>
</div>
</transition>
<img
:src="leftSrc"
class="toSafety-fixed-left-img"
@click="arrowRetract"
id="arrowLeft"
/>
<img :src="leftSrc" class="toSafety-fixed-left-img" @click="arrowRetract" id="arrowLeft" />
</div>
<div class="div-right" :class="{ isShow: leftShow, isHide: !leftShow }">
@ -52,22 +37,15 @@
{{ attributeInformation }}
</div>
<div class="model-property-nav" v-if="propertyLoad == 'end'">
<el-radio-group
v-model="selPropertyType"
size="small"
fill="#6cf"
>
<el-radio-group v-model="selPropertyType" size="small" fill="#6cf">
<el-radio-button label="att">属性</el-radio-button>
<el-radio-button label="type">类型</el-radio-button>
</el-radio-group>
</div>
<div class="model-property-list" v-if="propertyLoad == 'end'">
<div
v-for="(item, index) in selPropertyType == 'att'
<div v-for="(item, index) in selPropertyType == 'att'
? propertyAttr
: propertyType"
:key="index"
>
: propertyType" :key="index">
<div class="group-info">
<svg-icon icon-class="info" />
<span>{{ item.name }}</span>
@ -89,20 +67,11 @@
<span>{{ item.name }}</span>
</div>
<table class="model-property-table my-table">
<tr
v-for="(item2, index2) in item.data"
:key="index2 + '-' + index"
>
<th
width="50%"
:class="'txt' + selectMenu + item2.name"
>
<tr v-for="(item2, index2) in item.data" :key="index2 + '-' + index">
<th width="50%" :class="'txt' + selectMenu + item2.name">
{{ item2.name }}
</th>
<td
width="50%"
:class="'txt' + selectMenu + item2.name"
>
<td width="50%" :class="'txt' + selectMenu + item2.name">
{{ item2.value }}
<span v-if="index == 0">米</span>
<span v-if="index == 1">米<sup>2</sup></span>
@ -139,31 +108,16 @@
</div>
</div>
<template v-if="selectMenu == 6">
<el-button
type="primary"
@click="clearAllHide"
class="clear-all-btn"
>清除所有</el-button
>
<el-button type="primary" @click="clearAllHide" class="clear-all-btn">清除所有</el-button>
<div class="hide-list scroll">
<div
v-for="(item, index) in hideFeatureIds"
:key="index"
class="hide-item"
>
<div v-for="(item, index) in hideFeatureIds" :key="index" class="hide-item">
<div class="hide-item-state">
{{ item.show ? "隐藏" : "显示" }}
</div>
<el-switch
v-model="item.show"
@change="changeSwitch(item)"
></el-switch>
<el-switch v-model="item.show" @change="changeSwitch(item)"></el-switch>
<div class="hide-item-id">{{ item.id }}</div>
<div class="hide-item-delete">
<i
class="el-icon-delete command"
@click="deleteFeature(item)"
/>
<i class="el-icon-delete command" @click="deleteFeature(item)" />
</div>
</div>
</div>
@ -191,30 +145,16 @@
<svg-icon icon-class="info" />
<span>当前进度</span>
</div>
<el-progress
:text-inside="true"
:stroke-width="26"
color="#37A685"
:percentage="70"
/>
<el-progress :text-inside="true" :stroke-width="26" color="#37A685" :percentage="70" />
</div>
</div>
</div>
</transition>
<img
:src="rightSrc"
class="toSafety-fixed-right-img"
@click="arrowRetract"
id="arrowRight"
/>
<img :src="rightSrc" class="toSafety-fixed-right-img" @click="arrowRetract" id="arrowRight" />
</div>
<div class="div-tools">
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 0 }"
@click="doSelectMenu(0)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 0 }" @click="doSelectMenu(0)">
<el-tooltip content="默认视点" placement="top">
<div class="icon">
<svg-icon icon-class="home" />
@ -222,11 +162,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 1 }"
@click="doSelectMenu(1)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 1 }" @click="doSelectMenu(1)">
<el-tooltip content="构建测量" placement="top">
<div class="icon">
<svg-icon icon-class="size2" />
@ -234,12 +170,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 2 }"
@click="doSelectMenu(2)"
v-if="1 == 2"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 2 }" @click="doSelectMenu(2)" v-if="1 == 2">
<el-tooltip content="构建面积" placement="top">
<div class="icon">
<svg-icon icon-class="area2" />
@ -247,12 +178,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 3 }"
@click="doSelectMenu(3)"
v-if="1 == 2"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 3 }" @click="doSelectMenu(3)" v-if="1 == 2">
<el-tooltip content="构建体积" placement="top">
<div class="icon">
<svg-icon icon-class="volume" />
@ -260,11 +186,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 4 }"
@click="doSelectMenu(4)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 4 }" @click="doSelectMenu(4)">
<el-tooltip content="距离测量" placement="top">
<div class="icon">
<svg-icon icon-class="distance" />
@ -272,11 +194,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 5 }"
@click="doSelectMenu(5)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 5 }" @click="doSelectMenu(5)">
<el-tooltip content="剖切" placement="top">
<div class="icon">
<svg-icon icon-class="sectioning" />
@ -284,11 +202,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 6 }"
@click="doSelectMenu(6)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 6 }" @click="doSelectMenu(6)">
<el-tooltip content="构建隐藏" placement="top">
<div class="icon">
<svg-icon icon-class="hide" />
@ -296,11 +210,7 @@
</el-tooltip>
</div>
<div
class="tool-item"
:class="{ 'is-selected': selectMenu == 7 }"
@click="doSelectMenu(7)"
>
<div class="tool-item" :class="{ 'is-selected': selectMenu == 7 }" @click="doSelectMenu(7)">
<el-tooltip content="构建属性" placement="top">
<div class="icon">
<svg-icon icon-class="attribute" />
@ -370,6 +280,9 @@ export default {
this.initEngine();
},
methods: {
clipShow() {
this.$refs.clipDlialog.showDialog(this);
},
clientShow() {
return this.bimCfg?.clientApi || false;
},
@ -676,6 +589,16 @@ export default {
if (this.models.length == 0) {
this.$message.error("暂无模型，请先关联模型");
} else {
if (this.bimCfg.clientApi) {
bimTools.loadClipModel(window.bimBriefingApi,
this.bimCfg,
this.models,
(hideParts) => {
this.clipHideParts = hideParts;
bimTools.hideParts(window.bimBriefingApi, hideParts);
});
}
bimTools.addModelList(
window.bimBriefingApi,
this.bimCfg,
@ -695,6 +618,7 @@ export default {
setTimeout(() => {
this.doSelectMenu(7);
}, 4000);
}, 1000);
}
);
@ -710,6 +634,7 @@ export default {
}
});
},
loadModelTree() {
this.modelTrees = [
{
@ -774,48 +699,6 @@ export default {
bimTools.resetScene(this, bimBriefingApi);
bimTools.hideParts(window.bimBriefingApi, this.hideParts);
},
myClip(z) {
let api = bimBriefingApi;
let zClip = z||0.5; // 尝试正值
//TODO 模型按Z轴剖切
try {
// 等待一小段时间确保剖切系统初始化完成
setTimeout(() => {
// 遍历所有加载的模型并应用剖切
this.models.forEach(model => {
const modelId = model.modelId;
console.log("尝试对模型应用剖切:", modelId);
if (api.m_model && api.m_model.get(modelId)) {
// 创建沿Z轴的剖切平面
const clippingPlanes = new Cesium.ClippingPlaneCollection({
planes: [
new Cesium.ClippingPlane(new Cesium.Cartesian3(0.0, 0.0, 1.0), zClip), // 1.0表示沿Z轴正方向剖切
],
edgeWidth: 1.0,
edgeColor: Cesium.Color.RED,
enabled: true
});
// 将剖切平面应用到模型
api.m_model.get(modelId).clippingPlanes = clippingPlanes;
console.log("剖切平面已应用到模型:", modelId);
} else {
console.log("模型未找到或未加载:", modelId);
}
});
console.log("Z轴剖切已应用，剖切位置:", zClip);
this.$message.success("剖切操作已完成，剖切位置: " + zClip);
}, 100);
} catch (error) {
console.error("剖切操作失败:", error);
this.$message.error("剖切操作失败: " + error.message);
}
},
},
};
</script>
@ -899,13 +782,16 @@ export default {
.txt4X {
color: #f92e2e;
}
.txt4Y {
color: #8fed12;
}
.txt4Z {
color: orange;
}
}
.hide-list {
height: calc(100% - 60px);
overflow-y: auto;
@ -1207,6 +1093,7 @@ export default {
}
.my-table {
td,
th {
font-size: 20px;