42 lines
2.0 KiB
Vue
42 lines
2.0 KiB
Vue
<script setup lang="ts">
|
|
const lamelles_count = useState<number>('lamelles_count')
|
|
const fence_section = useState<number>('fence_section')
|
|
|
|
const lSize = 0.115
|
|
const bSize = 0.0235
|
|
const pillar_size = 80 * 0.001
|
|
const { scene, renderer, camera } = useTresContext()
|
|
watch([lamelles_count, fence_section], () => {
|
|
// console.log(scene)
|
|
console.log(lamelles_count)
|
|
renderer.value.render(scene.value, camera.value)
|
|
})
|
|
</script>
|
|
<template>
|
|
<Suspense>
|
|
<TresGroup>
|
|
<ModelItem model-url="/models_one/bottom.glb" :position="[-fence_section * 0.5 - pillar_size, -bSize, 0]"
|
|
:remove-pos="true" />
|
|
<ModelItem model-url="/models_one/bottom.glb" :position="[fence_section * 0.5 + pillar_size, -bSize, 0]"
|
|
:remove-pos="true" />
|
|
<ModelItem model-url="/models_one/verh_100.glb"
|
|
:position="[-fence_section * 0.5, lamelles_count * lSize, 0]" :remove-pos="true" />
|
|
<ModelItem model-url="/models_one/verh_100.glb"
|
|
:position="[fence_section * 0.5, lamelles_count * lSize, 0]" :remove-pos="true" />
|
|
<template v-for="(n, i) in lamelles_count">
|
|
<TresGroup :position="[-fence_section * 0.5 - pillar_size, (lSize * i), 0]">
|
|
<ModelItem model-url="/models_one/stolb.glb" :remove-pos="true" />
|
|
</TresGroup>
|
|
<TresGroup :position="[fence_section * 0.5 + pillar_size, (lSize * i), 0]" :scale="[-1, 1, 1]">
|
|
<ModelItem model-url="/models_one/stolb.glb" :remove-pos="true" />
|
|
</TresGroup>
|
|
<TresGroup :scale-x="fence_section * 10" :position="[0, (lSize * i), 0.03]">
|
|
<ModelItem model-url="/models_one/lamel_100.glb" :remove-pos="true" />
|
|
</TresGroup>
|
|
</template>
|
|
<TresGroup :scale-x="fence_section * 10" :position="[0, lamelles_count * lSize, 0]">
|
|
<ModelItem model-url="/models_one/verh_100.glb" :remove-pos="true" />
|
|
</TresGroup>
|
|
</TresGroup>
|
|
</Suspense>
|
|
</template> |