Skip to content

案例展示

模型呼吸效果

<template>
    <div id="TO"></div>
</template>

<script setup>
import { onMounted } from 'vue';

onMounted(() => {
    //初始化场景
    let TO = new ThingOrigin("fileModel", document.getElementById("TO"), {

        scene: {
            ground: {//地面
                active: false
            },
            background: {
                type: 'color',//设置背景颜色
                color: {
                    alpha: 1, // 透明度 取值范围0~1
                    color: "#000000",// 背景颜色
                },
            },
        },
    })

    //导入模型
    TO.model.initFileModel(
        {
            modelName: "fileModel-" + new Date().getTime(),//模型名称
            base: {
                modelUrl: `${import.meta.env.BASE_URL}models/car.gltf`,//模型地址
            },
            modelType: "gltf",//模型类型
            scale: {//缩放大小
                x: 10,
                y: 10,
                z: 10,
            },
        }
    ).then((model) => {
        //添加模型到场景中
        TO.scene.add(model.scene);
        //初始化breath效果
        TO.effect.initBreath(model.scene);
    });
});
</script>

<style scoped>
#TO {
    width: 100%;
    height: 400px;
    position: relative;
}
</style>

API 介绍

effect.initBreath

方法签名返回值描述
initBreath(model: Object3D)void给模型添加呼吸效果

参数说明:

参数名说明类型必填默认值
model模型Object3D-