2023-05-26 14:21:14 +08:00
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { Model as LingoModel, OrbitCamera, World, useAnimation } from 'lingo3d-vue'
|
|
|
|
|
|
2023-05-26 19:53:05 +08:00
|
|
|
$defineProps<{
|
|
|
|
|
src: string
|
2023-05-30 15:58:04 +08:00
|
|
|
width:number
|
2023-05-26 19:53:05 +08:00
|
|
|
}>()
|
|
|
|
|
|
2023-05-26 14:21:14 +08:00
|
|
|
const anim = useAnimation({ from: 180, to: 0, duration: 5000 })
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
2023-05-30 15:58:04 +08:00
|
|
|
<div class="relative h-96 w-500px bg-transparent" style="width:width+'px'">
|
2023-05-26 14:21:14 +08:00
|
|
|
<World color="transparent" default-light="studio">
|
2023-05-26 19:53:05 +08:00
|
|
|
<LingoModel :src="src" :y="0" :rotation-z="anim" :box-visible="false" />
|
2023-05-30 15:58:04 +08:00
|
|
|
<OrbitCamera active :z="100" :y="80" :zoom="0.8" auto-rotate enable-damping />
|
2023-05-26 14:21:14 +08:00
|
|
|
</World>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
