案例展示
给模型加上包围盒
<template>
<div style="position: relative;">
<div id="TO"></div>
<el-button type="primary" size="small" id="show" @click="show()">显示</el-button>
<el-button type="primary" size="small" id="hide" @click="hide()">删除</el-button>
</div>
</template>
<script setup>
import { onMounted } from 'vue'
let TO = null, uuid = '';
onMounted(() => {
//初始化场景
TO = new ThingOrigin("fileModel", document.getElementById("TO"), {
scene: {//场景
ground: { //地面
active: false
}
},
});
createCube()
})
function createCube() {
//创建一个立方体
let Sphere = TO.model.initSphere({
modelName: 'Sphere',
position: {//位置
x: 0,
y: 5,
z: 0,
},
scale:{ //缩放
x: 4,
y: 4,
z: 4
}
});
TO.scene.add(Sphere);
uuid = Sphere.uuid;
show();
}
//显示
function show() {
TO.helper.initBox(uuid);
}
//删除
function hide() {
console.log(TO.scene.children )
TO.helper.removeBox("Sphere");
}
</script>
<style scoped>
#TO {
width: 100%;
height: 400px;
position: relative;
}
#show {
position: absolute;
top: 10px;
right: 70px;
}
#hide {
position: absolute;
top: 10px;
right: 10px;
}
</style>API 介绍
helper.initBox
| 方法签名 | 返回值 | 描述 |
|---|---|---|
initBox(uuid: string) | void | 给模型创建包围盒 |
参数说明:
| 参数名 | 说明 | 类型 | 必填 | 默认值 |
|---|---|---|---|---|
uuid | 模型uuid | string | 是 | - |
helper.removeBox
| 方法签名 | 返回值 | 描述 |
|---|---|---|
removeBox(modelName?: string) | void | 移除包围盒 |
参数说明:
| 参数名 | 说明 | 类型 | 必填 | 默认值 |
|---|---|---|---|---|
modelName | 模型名称 | string | - | - |