FBXModel

A component based on useFBX to load models in TresJS scenes.

The FBXModel component is a wrapper around useFBX composable and accepts the same options as props.

Usage

<script setup lang="ts">
import { FBXModel } from '@tresjs/cientos'

const path = './Jeep_done.fbx'
</script>

<template>
  <FBXModel :path="path" />
</template>

<script setup lang="ts">
import { OrbitControls } from '@tresjs/cientos'
import { TresCanvas } from '@tresjs/core'
import TheModel from './TheModel.vue'
</script>

<template>
  <TresCanvas clear-color="#F78B3D">
    <TresPerspectiveCamera :position="[3, 2, 5]" />
    <OrbitControls />
    <TheModel />
    <TresDirectionalLight
      :intensity="2"
      :position="[3, 3, 3]"
    />
    <TresAmbientLight :intensity="1" />
  </TresCanvas>
</template>

Model reference

You can access the model reference by passing a ref to the FBXModel component and then using it to get the object.

<script setup lang="ts">
import type { TresObject } from '@tresjs/core'
import { FBXModel } from '@tresjs/cientos'

const modelRef = shallowRef<TresObject>()

watch(modelRef, (model) => {
  // Do something with the model
  model.position.set(0, 0, 0)
})
</script>

<template>
  <FBXModel
    ref="modelRef"
    path="https://raw.githubusercontent.com/Tresjs/assets/main/models/fbx/low-poly-truck/Jeep_done.fbx"
  />
</template>

Props

Prop	Description	Default
`path`	Path to the model file.	`undefined`
`castShadow`	Apply `cast-shadow` to all meshes inside your model.	`false`
`receiveShadow`	Apply `receive-shadow` to all meshes inside your model.	`false`

useFBX

A composable to load FBX models in TresJS scenes.

useTexture

A composable to load textures in TresJS scenes.