This commit is contained in:
Kseninia Mikhaylova 2024-07-12 15:36:29 +03:00
parent b8183f3180
commit 84a59073fe
2 changed files with 15 additions and 5 deletions

View File

@ -4,8 +4,8 @@ import type { Ref } from 'vue'
import { RouterLink, useRoute } from 'vue-router'; import { RouterLink, useRoute } from 'vue-router';
import { Vector3 } from 'three'; import { Vector3 } from 'three';
import { TresCanvas } from '@tresjs/core'; import { TresCanvas, vLightHelper } from '@tresjs/core';
import { StatsGl, OrbitControls, Stats } from '@tresjs/cientos' import { OrbitControls, Stats } from '@tresjs/cientos'
import LoadModels from './load_models.vue' import LoadModels from './load_models.vue'
import Sidebar from './sidebar.vue' import Sidebar from './sidebar.vue'
@ -57,16 +57,26 @@ watch(() => route.params.target, () => {
<template> <template>
<div> <div>
<div :class="[{ 'loading': !models_loading }, 'canvas-wrapper']"> <div :class="[{ 'loading': !models_loading }, 'canvas-wrapper']">
<TresCanvas window-size :alpha="false" :antialias="false" :stencil="false" power-preference="high-performance" precision="lowp"> <TresCanvas window-size shadows :alpha="false" power-preference="high-performance">
<TresPerspectiveCamera :position="cameraPosition" ref="camera" /> <TresPerspectiveCamera :position="cameraPosition" ref="camera" />
<OrbitControls v-bind="controlsState" @change="onChange" make-default /> <OrbitControls v-bind="controlsState" @change="onChange" make-default />
<Suspense> <Suspense>
<LoadModels :source="source" :loaded="set_model_load_status" :loaded_pan="loadedPan" /> <LoadModels :source="source" :loaded="set_model_load_status" :loaded_pan="loadedPan" />
</Suspense> </Suspense>
<TresMesh :position-y="0" :rotate-x="-Math.PI / 2" receive-shadow> <TresMesh :position-y="-1" :rotate-x="-Math.PI / 2" receive-shadow name="ground" v-if="false">
<TresPlaneGeometry :args="[200, 200]" /> <TresPlaneGeometry :args="[200, 200]" />
<TresShadowMaterial :opacity="0.2" /> <TresShadowMaterial :opacity="0.2" />
</TresMesh> </TresMesh>
<TresGroup name="lights" v-if="false">
<TresHemisphereLight :intensity="100" :position-x="50" :position-y="20" cast-shadow color="red"
v-light-helper />
<TresPointLight :intensity="100" :position-x="0" :position-y="20" cast-shadow color="green"
v-light-helper />
<TresDirectionalLight :intensity="100" :position-x="-50" :position-y="20" cast-shadow color="blue"
v-light-helper />
<TresPointLight :intensity="2000" :position-x="0" :position-y="20" cast-shadow color="rgb(0,255,0)"/>
</TresGroup>
<Suspense> <Suspense>
<Stats /> <Stats />
</Suspense> </Suspense>