remove ctx

components/calcModels.vue

@@ -83,13 +83,13 @@ watch(section_count, () => {
             <TresCanvas shadows>
                 <TresPerspectiveCamera v-bind="cameraStat" ref="camera" />
                 <OrbitControls v-bind="controlsState" make-default />
-                <TresGroup :position-x="Math.min(section_count, 20) * fence_section * -1" :position-y="-3">
+                <TresGroup :position-x="Math.min(section_count, 12) * fence_section * -1" :position-y="-3">
                     <Suspense>
                         <ModelParametric />
                     </Suspense>
                 </TresGroup>
                 <TresMesh receive-shadow :position-y="-3.65" name="ground">
-                    <TresCircleGeometry :args="[100, 32]" :rotate-x="-Math.PI * 0.5" />
+                    <TresCircleGeometry :args="[50, 32]" :rotate-x="-Math.PI * 0.5" />
                     <TresMeshStandardMaterial v-bind="groundMaterial" />
                 </TresMesh>
                 <template v-if="pointLight">

components/calcValues.vue

@@ -196,7 +196,7 @@ const plurals = {
                         Забор общей длиной {{ form_state.total_length }}{{ '\xa0' }}м,
                         {{ section_count }}
                         <Plural :n="section_count" :forms="plurals.section" /> по
-                        {{ form_state.length.toFixed(2) }}{{ '\xa0' }}мм<template v-if="form_state.extra_section">
+                        {{ (form_state.length || 0).toFixed(2) }}{{ '\xa0' }}мм<template v-if="form_state.extra_section">
                             и 1 дополнительная секция длиной {{ form_state.extra_section.toFixed(2) }}{{ '\xa0'
                             }}мм</template>.
                     </p>

components/model/fence.vue

@@ -35,29 +35,6 @@ watch(fence_section, () => {
     translate_to_section.value = make_translate_to_section()
 })
 
-const s = 512
-const canvas = document.createElement('canvas')
-canvas.width = s
-canvas.height = s
-const ctx = canvas.getContext('2d') as CanvasRenderingContext2D
-ctx.fillStyle = "red"
-ctx.font = "512px serif"
-ctx.textAlign = "center"
-ctx.textBaseline = 'middle'
-ctx.fillText(props.index, s * 0.5, s * 0.5)
-
-const textures: any[] = []
-for (let index = 0; index < lamelles_count.value; index++) {
-    const element = document.createElement('canvas')
-    element.width = s
-    element.height = s / lamelles_count.value
-    const e_ctx = element.getContext('2d') as CanvasRenderingContext2D
-    e_ctx.drawImage(canvas,
-        0, (s / lamelles_count.value) * index, s, s / lamelles_count.value,
-        0, 0, s, s / lamelles_count.value
-    );
-    textures.push(new CanvasTexture(element))
-}
 const extra = ref((extra_section && props.index == (section_count.value + 1)) ? extra_section.value * 0.001 : false)
 if (extra.value) {
     pillar_one_pos.value = (extra.value as number) * -0.5 - 0.015
@@ -112,8 +89,7 @@ watch([section_count, fence_section, extra_section], () => {
         <TresGroup name="lamelles">
             <template v-for="(n, i) in lamelles_count">
                 <TresGroup :position="[pillar_size * 0.5, (lSize * i), 0.02]" :scale-x="(extra || fence_section) * 10">
-                    <ModelItem :model="props.models.lamelle" :color="getColorHexFromRal(lamelle_color)"
+                    <ModelItem :model="props.models.lamelle" :color="getColorHexFromRal(lamelle_color)" />
-                        :map="textures[textures.length - 1 - i]" />
                 </TresGroup>
             </template>
         </TresGroup>

components/model/parametric.vue

@@ -15,10 +15,10 @@ renderer.value.toneMapping = ReinhardToneMapping
 renderer.value.shadowMap.enabled = true
 renderer.value.shadowMap.type = PCFSoftShadowMap
 
-const { scene: top } = await useGLTF('/models_one/verh_100.glb')
+const { scene: top } = await useGLTF('/models_one/verh_100.glb', { draco: true })
-const { scene: fence } = await useGLTF('/models_one/fence.glb')
+const { scene: fence } = await useGLTF('/models_one/fence.glb', { draco: true })
-const { scene: fastening } = await useGLTF('/models_one/krepleniye_planok (1).glb')
+const { scene: fastening } = await useGLTF('/models_one/krepleniye_planok (1).glb', { draco: true })
-const { scene: lamelle } = await useGLTF('/models_one/lamel_100.glb')
+const { scene: lamelle } = await useGLTF('/models_one/lamel_100.glb', { draco: true })
 
 const { seek } = useSeek()
 watch([section_count, extra_section], () => {
@@ -49,7 +49,7 @@ onMounted(() => {
 <template>
     <TresGroup name="base">
         <template v-for="i in (section_count + ~~(!!extra_section))">
-            <template v-if="i <= 20">
+            <template v-if="i <= 12">
                 <ModelFence :index="i" :models="{ top, fence, fastening, lamelle }" />
             </template>
         </template>