案例展示

模型呼吸效果

<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' // 背景颜色
                }
            }
        },
        camera: {
            // 相机配置
            position: {
                // 相机位置
                x: 0,
                y: 50,
                z: 200
            }
        }
    })
    let modelData = {
        modelName: 'fileModel-' + new Date().getTime(), //模型名称
        base: {
            modelUrl: 'https://124.70.30.193:8443/model2/loadFileAsId/589750924' //模型地址
        },
        modelType: 'gltf', //模型类型
        scale: {
            //缩放大小
            x: 2,
            y: 2,
            z: 2
        },
        position: {
            x: 40,
            y: 0,
            z: 10
        }
    }

    for (let i = 0; i < 3; i++) {
        TO.model.loadModel(modelData).then((model) => {
            model.position.set(model.position.x * i, 0, 0)
            //添加到场景中
            TO.scene.add(model)
            //初始化breath效果
            TO.effect.initBreath(model)
        })
    }
})
</script>

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

API 介绍

effect.initBreath

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

参数说明：

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