Skip to content

案例展示

给模型加上包围盒

<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模型uuidstring-

helper.removeBox

方法签名返回值描述
removeBox(modelName?: string)void移除包围盒

参数说明:

参数名说明类型必填默认值
modelName模型名称string--