客户端渲染

dev_xd
lj7788@126.com 2025-08-30 11:33:32 +08:00
parent 432ae50f24
commit 9ac6586e86
4 changed files with 180 additions and 73 deletions

View File

@ -27,7 +27,7 @@
<link rel="stylesheet" href="/cdn/Cesium/Widgets/widgets.css" />
<!-- <script src="/cesium/jquery-3.0.0.min.js"></script> -->
<script src="/cdn/Cesium/Cesium.js?v=20250729"></script>
<script src="/cdn/Cesium/BIMGISEngine.js?v=20250729"></script>
<script src="/cdn/Cesium/BIMGISEngine.js?v=20250820"></script>
<script src="/cdn/Cesium/initApi.js?v=20230920"></script>
<!--<script src="/cdn/map/initApi.js"></script> -->

View File

@ -46,9 +46,37 @@ function dataFiltering(that, id) {
});
}
/**
* 获取构件属性信息
* 获取构件属性信息-客户端渲染
*/
function getClientProperty(that) {
let api = bimBriefingApi;
api.Public.event("LEFT_CLICK", e => {
api.Feature.getByEvent(e.position, n => {
if (n && n["id"]) {
let featureId = n.id;
if (featureId.split("^")[1]) {
clearSelectFeature(that);
api.Feature.setColor(featureId, 255, 0, 255, 1);
that.selFeatureId = featureId;
dataFiltering(that, featureId);
that.propertyLoad = "start";
that.attributeInformation = "查询中,请稍候~";
}
} else {
that.attributeInformation = "未选中构件";
}
}, false, false)
});
}
/**
* 获取构件属性信息-服务端渲染
*/
function getProperty(that) {
that.$message.info("请在模型中点击选中构件");
if (that.isClient) {
getClientProperty(that);
return;
}
let api = bimBriefingApi;
api.Feature.getByEvent(true, (n) => {
if (n && n["id"]) {
@ -74,18 +102,67 @@ function getModelUnit(that, modelId) {
}
/**
* 获取构件尺寸信息
* 获取构件尺寸信息-客户端渲染
*/
function subFeatureSize(that) {
function subFeatureSizeClient(that) {
let api = bimBriefingApi;
let result = [
{ name: "构建尺寸", data: [] },
{ name: "构建表面积", data: [] },
{ name: "构建体积", data: [] },
];
api.Public.event("LEFT_CLICK", e => {
api.Feature.getByEvent(e.position, n => {
if (n && n["id"]) {
let featureId = n.id;
if (featureId.split("^")[1]) {
let modelId = featureId.split("^")[0];
clearSelectFeature(that);
api.Feature.setColor(featureId, 255, 0, 255, 1);
that.selFeatureId = featureId;
api.Feature.getGeometrySizeById(featureId, modelId, res => {
if (res) {
let unit = getModelUnit(that, modelId);
let size = res || {};
let x = (size.x || 0) * unit * 1.0;
let y = (size.y || 0) * unit * 1.0;
let z = (size.z || 0) * unit * 1.0;
result[0].data = [
{ name: "长", value: x.toFixed(2) + "" },
{ name: "宽", value: y.toFixed(2) + "" },
{ name: "高", value: z.toFixed(2) + "" },
];
result[1].data = [{ name: "面积", value: (x * y).toFixed(4) + "" }];
result[2].data = [{ name: "体积", value: (x * y * z).toFixed(6) }];
}
});
}
}
});
});
that.info = result;
}
/**
* 获取构件尺寸信息-服务端渲染
*/
function subFeatureSize(that) {
let api = bimBriefingApi;
that.info = [];
api.Public.clearHandler();
api.Measurement.clearAllTrace();
if (that.isClient) {
subFeatureSizeClient(that);
return;
}
let result = [
{ name: "构建尺寸", data: [] },
{ name: "构建表面积", data: [] },
{ name: "构建体积", data: [] },
];
api.Feature.getByEvent(true, (n) => {
if (n && n["id"]) {
let featureId = n.id;
@ -115,7 +192,8 @@ function subFeatureSize(that) {
function measurementArea(that) {
let api = bimBriefingApi;
that.info = [];
api.Public.clearHandler(), api.Measurement.clearAllTrace();
api.Public.clearHandler();
api.Measurement.clearAllTrace();
api.Feature.getByEvent(true, (n) => {
console.log(n);
if (n && n["id"]) {
@ -133,13 +211,55 @@ function measurementArea(that) {
//构件体积
function measuringVolume(that) { }
//构件距离
//构件距离--客户端渲染
function distanceClient(that) {
let api = bimBriefingApi;
let result = [{ name: "测量结果", data: [] }];
let unit = 1;
api.Public.event("LEFT_CLICK", e => {
api.Feature.getByEvent(e.position, n => {
if (n && n["id"]) {
let featureId = n.id;
if (featureId.split("^")[1]) {
let modelId = featureId.split("^")[0];
unit = getModelUnit(that, modelId);
}
}
});
});
api.Measurement.distance(data => {
if (data) {
result[0].data = [
{
name: "距离",
value: (data.dis * unit).toFixed(2),
},
{ name: "X", value: (data.X * unit).toFixed(2) },
{ name: "Y", value: (data.Y * unit).toFixed(2) },
{ name: "Z", value: (data.Z * unit).toFixed(2) },
];
that.info = result;
}
}, true);
}
//构件距离--服务端渲染
function distance(that) {
let api = bimBriefingApi;
let result = [{ name: "测量结果", data: [] }];
that.$message.info("请在模型中点击两点,右键结束测量");
api.Public.clearHandler();
api.Measurement.clearAllTrace();
api.Public.event("LEFT_CLICK", (res) => {
api.Measurement.clearAllTrace();
});
//右键结束测量
api.Public.event("RIGHT_CLICK", (res) => {
api.Measurement.distance(false);
});
if (that.isClient) {
distanceClient(that);
return;
}
let unit = 1;
api.Feature.getByEvent(true, (n) => {
if (n && n["id"]) {
@ -162,19 +282,23 @@ function distance(that) {
that.info = result;
});
api.Public.event("LEFT_CLICK", (res) => {
api.Measurement.clearAllTrace();
});
//右键结束测量
api.Public.event("RIGHT_CLICK", (res) => {
api.Measurement.distance(false);
});
}
function getModels(that) {
return that.models.map((d) => d.modelId);
}
//剖切
//剖切 -- 客户端渲染
function initClientClipping(that) {
let api = bimBriefingApi;
}
//剖切 -- 服务端渲染
function initClipping(that) {
api.Public.clearHandler();
api.Measurement.clearAllTrace();
if(that.isClient){
initClientClipping(that);
return;
}
let api = bimBriefingApi;
api.Model.clipByBox(getModels(that));
}

View File

@ -50,8 +50,8 @@
</div>
<table class="model-property-table my-table">
<tr v-for="(item2, index) in item.data" :key="index">
<th width="50%">{{ item2.propertyName }}</th>
<td width="50%">{{ item2.value }}</td>
<th width="50%" >{{ item2.propertyName }}</th>
<td width="50%" >{{ item2.value }}</td>
</tr>
</table>
</div>
@ -66,8 +66,8 @@
</div>
<table class="model-property-table my-table">
<tr v-for="(item2, index2) in item.data" :key="index2 + '-' + index">
<th width="50%">{{ item2.name }}</th>
<td width="50%">
<th width="50%" :class="'txt'+selectMenu+item2.name">{{ item2.name }}</th>
<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>
@ -216,7 +216,6 @@
<script>
import debounce from "lodash.debounce";
import { MergeArray, DelArray } from "@/utils/tools";
import briefingTools from "./bim/briefingTools";
import SvgIcon from "@/components/SvgIcon.vue";
import apiTools from './bim/apiTools.js'
@ -248,6 +247,7 @@ export default {
info: [],
title: "属性",
showClipping: false,
isClient: false,
};
},
mounted() {
@ -266,6 +266,7 @@ export default {
this.initEngine();
})
);
window.bbApp=this
this.selProject = this.$store.getters.selProject;
this.initEngine();
},
@ -374,6 +375,7 @@ export default {
this.showClipping = false;
briefingTools.clearSelectFeature(this);
}
briefingTools.clearSelectFeature(this);
switch (index) {
case 0:
this.resetScene();
@ -423,6 +425,7 @@ export default {
it.visible = true;
api.Model.setVisible(it.modelId, true);
api.Model.original(it.modelId);
bimTools.hideParts(window.bimBriefingApi, this.hideParts);
});
} else {
that.models.forEach((it) => {
@ -434,6 +437,7 @@ export default {
if (checked) {
api.Model.setVisible(node.modelId, true);
api.Model.original(node.modelId);
bimTools.hideParts(window.bimBriefingApi, this.hideParts);
this.models.find((mm) => mm.modelId == node.modelId).visible = true;
} else {
api.Model.setVisible(node.modelId, false);
@ -462,6 +466,7 @@ export default {
api.Model.setVisible(node.modelId, true);
this.models.find((mm) => mm.modelId == node.modelId).visible = true;
api.Model.original(node.modelId);
bimTools.hideParts(window.bimBriefingApi, this.hideParts);
if (tmps.length > 0) {
let tmpsIds2 = tmps.splice(0, 1000);
api.Feature.showFeatures(tmpsIds2.join("#"));
@ -516,11 +521,7 @@ export default {
this.attributeInformation = "";
bimTools.initBimCfg(this);
setTimeout(() => {
if (this.clientShow()) {
apiTools.loadEngine(this, "bimBriefingContainer", 'bimBriefingApi', this.initLoadModel)
} else {
sapiTools.loadEngine(this, "bimBriefingContainer", 'bimBriefingApi', this.initLoadModel)
}
bimTools.initEngine("bimBriefingApi", "bimBriefingContainer", this.bimCfg, this.initLoadModel);
}, 10);
},
initLoadModel() {
@ -553,17 +554,29 @@ export default {
if (this.models.length == 0) {
this.$message.error("暂无模型,请先关联模型");
} else {
bimTools.addModelList(window.bimBriefingApi, this.bimCfg, this.models, (hideParts) => {
setTimeout(() => {
bimTools.setDefaultViewPoint(window.bimBriefingApi, this.bimCfg, this.viewPoint)
this.hideParts = hideParts;
bimTools.hideParts(window.bimBriefingApi, hideParts);
this.modelLoaded = true;
bimTools.initLoadModel(this, bimBriefingApi)
this.resetScene();
setTimeout(()=>{
this.doSelectMenu(7);
},4000);
}, 1000);
});
this.models.forEach((item) => {
item.modelId = item.lightweightName;
item.gis = JSON.parse(item.gisJson);
this.addModel(item.lightweightName);
this.doSelectMenu(7);
setTimeout(() => {
this.$refs.tree.setChecked(item.lightweightName, true, true);
}, 3000);
});
this.treeKey++;
bimTools.initLoadModel(this, bimBriefingApi)
this.treeKey++;
}
});
},
@ -621,52 +634,15 @@ export default {
return tmps;
};
node.children = makeTree(objs.filter((item) => item.level == 0));
node.children.forEach((item) => {
//this.treeExpendedKeys.push(item.key)
});
this.treeKey++;
});
},
addModel(modelId, cb) {
let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
let direction = null;
let modelInfo = this.models.find(m => m.modelId == modelId);
if (this.clientShow()) {
url = `/bimdata/Tools/output/model/${modelId}/root.glt`;
if (modelInfo) {
direction = modelInfo.bimCfg.direction;
}
}
let api = bimBriefingApi
console.log(modelId, url);
api.Model.add(
url,
modelId,
() => { },
() => {
cb && cb();
console.log("加载模型成功");
setTimeout(() => {
if (this.viewPoint) {
if (!this.clientShow()) {
api.Camera.setViewPort(this.viewPoint);
}
} else {
api.Camera.getViewPort((p) => {
this.viewPoint = p;
});
}
this.modelLoaded = true;
}, 1000);
},
direction
);
},
resetScene() {
this.selectedViewpoint = null;
this.selectedRoam = null;
bimBriefingApi.Measurement.clearAllTrace()
bimBriefingApi.Public.clearHandler()
bimTools.resetScene(this, bimBriefingApi)
bimTools.hideParts(window.bimBriefingApi, this.hideParts);
},
},
};
@ -747,6 +723,17 @@ export default {
margin: 10px;
}
.model-property-table{
.txt4X{
color:#f92e2e;
}
.txt4Y{
color:#8fed12;
}
.txt4Z{
color:orange;
}
}
.hide-list {
height: calc(100% - 60px);
overflow-y: auto;

View File

@ -459,15 +459,11 @@ export default {
bimTools.initBimCfg(this);
this.elId++;
this.activeMenu = 0;
bimTools.initBimCfg(this);
setTimeout(() => {
bimTools.initEngine("bimRoadmApi", "bimRoamingContainer", this.bimCfg, this.initLoadModel);
}, 10);
},
initLoadModel() {
if (this.selProject == null) {
return;
}
this.$api.bim.getDefaultViewPoint(this.selProject.id, 1).then((d) => {
let pt = "";
if (d.data && d.data.length > 0) {