Three Vue3Three Vue3
指南
  • English
  • 简体中文
GitHub
指南
  • English
  • 简体中文
GitHub
    • 快速开始
    • 场景
    • 天空盒
    • 模型加载器

      • 组件加载器
      • 函数加载器
    • 弹出窗口
    • 动态元素
      • 默认用法
      • 属性
      • 方法
    • 动画
    • 网格模型

      • 波动圆
    • 效果

      • 泛光

type

类

默认用法

点击我查看代码
<template>
  <tv-scene class="scene" @created="created"></tv-scene>
</template>

<script lang="ts" setup>
import { ME, GLTFLoader } from 'three-vue3'

const created = async (scene, { camera }) => {
  camera.position.set(0, 1.5, 3)

  // 加载模型到场景中。
  const model = await GLTFLoader('/models/perseverance.glb', true)
  model.scale.set(0.8, 0.8, 0.8)
  scene.add(model)

  // 创建动态元素。
  const element = new ME(model, [0, 0, -1])

  // 在10秒内将元素从 [0, 0, -1] 移动到 [0, 0, 0]。
  element.moveTo([0, 0, 0], 10000)
}
</script>

<style>
.scene {
  margin-top: 10px;
  width: 100%;
  height: 300px;
}
</style>

属性

名称类型描述
sceneTHREE.Group要展示和移动的模型。

方法

名称参数描述
constructor(model: THREE.Group, position: [number, number, number]) => voidmodel 操作的模型;position 初始位置。
在 GitHub 上编辑此页
Last Updated:
Contributors: Shing Rui
Prev
弹出窗口
Next
动画