math

app.vue

@@ -43,11 +43,6 @@ const { scrollToAnchor, scrollToTop } = useAnchorScroll({
     }
   },
 })
-
-console.log({
-  url:`${apiBase}/calculator/5/`,
-  d: calculatorData.value
-})
 </script>
 <template>
   <div>

components/calcModels.vue

@@ -3,11 +3,13 @@ import { TresCanvas } from '@tresjs/core'
 import { OrbitControls, useProgress, Environment } from '@tresjs/cientos'
 
 const controlsState = reactive({
-    minDistance: 1,
-    maxDistance: 10,
+    minDistance: 5,
+    maxDistance: 15,
     enablePan: false,
     // enableZoom: false,
     maxPolarAngle: (Math.PI / 2) - 0.2,
+    // maxZoom: 2,
+    // minZoom: 1,
 })
 const { hasFinishLoading, progress, items } = await useProgress()
 </script>

components/model/parametric.vue

@@ -30,12 +30,17 @@ const { scene: fence } = await useGLTF('/models_one/fence.glb')
 const { scene: fastening } = await useGLTF('/models_one/krepleniye_planok (1).glb')
 const { scene: lamelle } = await useGLTF('/models_one/lamel_100.glb')
 
-const pillar_one_pos = fence_section.value * -0.5
-const pillar_two_pos = fence_section.value * 0.5 + pillar_size + bSize
+const pillar_one_pos = ref(fence_section.value * -0.5 - 0.01)
+const pillar_two_pos = ref(fence_section.value * 0.5 + pillar_size + bSize)
+
+watch(fence_section, () => {
+    pillar_one_pos.value = fence_section.value * -0.5 - 0.01
+    pillar_two_pos.value = fence_section.value * 0.5 + pillar_size + bSize
+})
 </script>
 <template>
     <TresGroup :scale="3" :rotate-y="-Math.PI * -0.5" :translate-y="-3.25">
-        <TresMesh receive-shadow cast-shadow :translate-y="-0.25" v-if="false">
+        <TresMesh receive-shadow cast-shadow :translate-y="-0.26">
             <TresCircleGeometry :args="[8, 8, 8]" :rotate-x="-Math.PI * 0.5" />
             <TresMeshStandardMaterial v-bind="pbrTexture" color="violet" />
         </TresMesh>
@@ -60,8 +65,7 @@ const pillar_two_pos = fence_section.value * 0.5 + pillar_size + bSize
                 <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
             </TresGroup>
         </template>
-        <TresGroup :position="[pillar_two_pos, (lSize * lamelles_count), 0]"
-            :scale="[-1, 0.5, 1]">
+        <TresGroup :position="[pillar_two_pos, (lSize * lamelles_count), 0]" :scale="[-1, 0.5, 1]">
             <ModelItem :model="fence" :remove-pos="true" :color="pillar_color" />
         </TresGroup>
 
@@ -83,7 +87,7 @@ const pillar_two_pos = fence_section.value * 0.5 + pillar_size + bSize
             </TresGroup>
         </template>
 
-        <TresGroup :scale-x="fence_section * 10" :position="[pillar_size - bSize, lamelles_count * lSize, 0]" v-if=false>
+        <TresGroup :scale-x="fence_section * 10" :position="[pillar_size * 0.5, lamelles_count * lSize, 0]">
             <ModelItem :model="top" :remove-pos="true" :color="pillar_color" />
         </TresGroup>
     </TresGroup>