mns/mns-mini-zabor
mns
/
mns-mini-zabor
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bias - inner shadow fences

This commit is contained in:
Kseninia Mikhaylova 2024-06-14 12:22:07 +03:00
parent c376f378a4
commit df88962442
3 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/model/fence.vue
View File

@ -14,11 +14,11 @@ const lSize = 0.115
const bSize = 0.0235 const bSize = 0.0235
const pillar_size = 80 * 0.001 const pillar_size = 80 * 0.001
const pillar_one_pos = ref(fence_section.value * -0.5 - 0.01) const pillar_one_pos = ref(fence_section.value * -0.5 - 0.015)
const pillar_two_pos = ref(fence_section.value * 0.5 + pillar_size + bSize - 0.01) const pillar_two_pos = ref(fence_section.value * 0.5 + pillar_size + bSize - 0.01)
watch([fence_section, lamelles_count], () => { watch([fence_section, lamelles_count], () => {
pillar_one_pos.value = fence_section.value * -0.5 - 0.01 pillar_one_pos.value = fence_section.value * -0.5 - 0.015
pillar_two_pos.value = fence_section.value * 0.5 + pillar_size + bSize - 0.01 pillar_two_pos.value = fence_section.value * 0.5 + pillar_size + bSize - 0.01
}) })
const scale_koef = 2.5 const scale_koef = 2.5

4
components/model/item.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { useGLTF } from '@tresjs/cientos' import { useGLTF } from '@tresjs/cientos'
import { Box3, Color, MeshStandardMaterial, Vector3 } from 'three'; import { Box3, Color, FrontSide, MeshStandardMaterial, Vector3 } from 'three';
const props = defineProps(['modelUrl', 'model', 'position', 'refPosition', 'removePos', 'target', 'color']) const props = defineProps(['modelUrl', 'model', 'position', 'refPosition', 'removePos', 'target', 'color'])
let scene let scene
@ -31,7 +31,7 @@ function shadows_and_pos(scene: any) {
scene.children.forEach((el: any) => { scene.children.forEach((el: any) => {
if (el.isMesh) { if (el.isMesh) {
el.castShadow = true el.castShadow = true
// el.receiveShadow = true el.receiveShadow = true
} }
if (props.removePos) { if (props.removePos) {
el.translateX(-el.position.x) el.translateX(-el.position.x)

12
components/model/parametric.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { import {
ReinhardToneMapping, PCFShadowMap, RepeatWrapping, ReinhardToneMapping, PCFSoftShadowMap, RepeatWrapping,
Color, DataTexture, Color, DataTexture,
PMREMGenerator, Euler, PMREMGenerator, Euler,
FrontSide FrontSide
@ -14,7 +14,7 @@ const { scene, renderer, camera } = useTresContext()
renderer.value.toneMapping = ReinhardToneMapping renderer.value.toneMapping = ReinhardToneMapping
renderer.value.shadowMap.enabled = true renderer.value.shadowMap.enabled = true
renderer.value.shadowMap.type = PCFShadowMap // renderer.value.shadowMap.type = PCFSoftShadowMap
// const pbrTexture = await useTexture({ // const pbrTexture = await useTexture({
// map: '/texture/Grass01_MR_2K/Grass01_2K_BaseColor.png ', // map: '/texture/Grass01_MR_2K/Grass01_2K_BaseColor.png ',
@ -123,10 +123,15 @@ onMounted(() => {
const pointLight = light.children[2] const pointLight = light.children[2]
pointLight.shadow.camera.near = 50 pointLight.shadow.camera.near = 50
const k = 1
console.log(pointLight.shadow)
pointLight.shadow.mapSize.width = 512 * k
pointLight.shadow.mapSize.height = 512 * k
pointLight.shadow.bias = -0.001
</script> </script>
<template> <template>
<TresGroup :translate-y="-3.25" name="base"> <TresGroup :translate-y="-3.25" name="base">
<TresMesh receive-shadow :position-y="-0.15" name="ground"> <TresMesh receive-shadow :position-y="-0.65" name="ground">
<TresCircleGeometry :args="[100, 32]" :rotate-x="-Math.PI * 0.5" /> <TresCircleGeometry :args="[100, 32]" :rotate-x="-Math.PI * 0.5" />
<TresMeshStandardMaterial v-bind="groundMaterial" /> <TresMeshStandardMaterial v-bind="groundMaterial" />
</TresMesh> </TresMesh>
@ -149,6 +154,7 @@ pointLight.shadow.camera.near = 50
<TresPointLight v-bind="pointLight" :intensity="pointLight.intensity * 0.25" <TresPointLight v-bind="pointLight" :intensity="pointLight.intensity * 0.25"
:position="Object.values(pointLight.position).map((el: any) => el * 3)" cast-shadow /> :position="Object.values(pointLight.position).map((el: any) => el * 3)" cast-shadow />
<TresAmbientLight color="rgb(191,231,255)" :intensity="5" /> <TresAmbientLight color="rgb(191,231,255)" :intensity="5" />
<template v-if="false"> <template v-if="false">
<template v-for="i in light.children[1].children"> <template v-for="i in light.children[1].children">