fix colors

This commit is contained in:
Kseninia Mikhaylova 2024-06-25 11:54:19 +03:00
parent bfed1bf6e5
commit 77faa8eae3
2 changed files with 12 additions and 9 deletions

View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { FrontSide, RepeatWrapping } from 'three'; import { FrontSide, RepeatWrapping, Vector2 } from 'three';
import { TresCanvas, useTexture } from '@tresjs/core' import { TresCanvas, useTexture } from '@tresjs/core'
import { OrbitControls, useGLTF } from '@tresjs/cientos' import { OrbitControls, useGLTF } from '@tresjs/cientos'
@ -29,13 +29,17 @@ const groundMaterial = ref({
roughness: 0.7, roughness: 0.7,
metalness: 0, metalness: 0,
side: FrontSide, side: FrontSide,
precision: 'lowp',
}) })
const loadAll = async () => { const loadAll = async () => {
const { scene: light } = await useGLTF('/models_light/zabor_so_svetom.glb') const { scene: light } = await useGLTF('/models_light/zabor_so_svetom.glb')
pointLight.value = light.children[2] pointLight.value = light.children[2]
pointLight.value.color = '#f0dea9' pointLight.value.color = '#f0dea9'
pointLight.value.power = pointLight.value.intensity
pointLight.value.intensity = 0
pointLight.value.shadow.camera.near = 50 pointLight.value.shadow.camera.near = 50
pointLight.value.shadow.bias = -0.002 pointLight.value.shadow.bias = -0.002
pointLight.value.shadow.bias = -0.002
const pbrTexture = await useTexture({ const pbrTexture = await useTexture({
map: '/texture/Grass004_2K-PNG/Grass004_2K-PNG_Color.png', map: '/texture/Grass004_2K-PNG/Grass004_2K-PNG_Color.png',
@ -102,8 +106,7 @@ watch([section_count, extra_section], () => {
</TresMesh> </TresMesh>
<template v-if="pointLight"> <template v-if="pointLight">
<TresPointLight v-bind="pointLight" <TresPointLight v-bind="pointLight" cast-shadow />
:position="Object.values(pointLight.position).map((el: any) => el * 7)" cast-shadow />
</template> </template>
<TresAmbientLight color="rgb(191,231,255)" :intensity="5" /> <TresAmbientLight color="rgb(191,231,255)" :intensity="5" />

View File

@ -38,13 +38,14 @@ set_material(lamelle.value, getColorHexFromRal(lamelle_color.value));
const { seek, seekAll } = useSeek() const { seek, seekAll } = useSeek()
watch(lamelle_color, () => { watch(lamelle_color, () => {
set_material(lamelle.value, getColorHexFromRal(lamelle_color.value))
const items = seekAll(scene.value, 'name', "lamelles") const items = seekAll(scene.value, 'name', "lamelles")
items.forEach(element => { items.forEach(element => {
set_material(element, getColorHexFromRal(lamelle_color.value)) set_material(element, getColorHexFromRal(lamelle_color.value))
}); });
set_material(lamelle.value, getColorHexFromRal(lamelle_color.value));
}) })
watch(pillar_color, () => { watch(pillar_color, () => {
[top, fence, fastening].map((el: any) => { set_material(el.value, getColorHexFromRal(pillar_color.value)) })
const items = [ const items = [
...seekAll(scene.value, 'name', "pillar_one"), ...seekAll(scene.value, 'name', "pillar_one"),
...seekAll(scene.value, 'name', "pillar_two"), ...seekAll(scene.value, 'name', "pillar_two"),
@ -54,8 +55,7 @@ watch(pillar_color, () => {
] ]
items.forEach(element => { items.forEach(element => {
set_material(element, getColorHexFromRal(pillar_color.value)) set_material(element, getColorHexFromRal(pillar_color.value))
}); })
[top, fence, fastening].map((el: any) => { set_material(el.value, getColorHexFromRal(pillar_color.value)) })
}) })
watch([section_count, extra_section], () => { watch([section_count, extra_section], () => {
const base = seek(scene.value, 'name', 'base') const base = seek(scene.value, 'name', 'base')
@ -81,7 +81,7 @@ onMounted(async () => {
scene.value.environment = newEnvMap scene.value.environment = newEnvMap
scene.value.background = exrBackground scene.value.background = exrBackground
scene.value.backgroundRotation = new Euler(0, 5, 0) scene.value.backgroundRotation = new Euler(0, 5, 0)
scene.value.backgroundMapping = EquirectangularReflectionMapping // scene.value.background.mapping = EquirectangularReflectionMapping
result.renderTarget.texture.dispose(); result.renderTarget.texture.dispose();
}) })