front/src/components/Promo/load_models.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { reactive, ref, watch } from 'vue';
-import { Box3, Color, Group, Mesh, MeshStandardMaterial, PointLight, SphereGeometry, Vector3 } from 'three';
+import { Box3, Color, Group, Mesh, Sprite, SpriteMaterial, TextureLoader, Vector3 } from 'three';
 import { useTresContext, useSeek } from '@tresjs/core';
 import { useGLTF } from '@tresjs/cientos'
 
@@ -77,24 +77,18 @@ const loadModels = async () => {
         const res_array = (find_element as Group).isGroup ? find_element?.children : [find_element]
         if (find_element && !(find_element as Group).isGroup) {
             const world_position = new Vector3();
-            (find_element as Mesh).geometry.boundingBox.getCenter(world_position);
+            ((find_element as Mesh).geometry.boundingBox as any).getCenter(world_position);
             (find_element as Mesh).localToWorld(world_position);
 
-            const light = new PointLight()
+            const map = new TextureLoader().load('sprite.png');
-            light.position.set(world_position.x, world_position.y * 5, world_position.z)
+            const material = new SpriteMaterial({ color: new Color('red') });
-            light.color = index % 2 ? new Color('red') : new Color('green');
+            const point = new Sprite(material);
-            light.power = 10000;
+            const p = raw_data.min_distance * 0.05
-
+            point.scale.set(p, p, 1)
-            const point = new Mesh(new SphereGeometry(2, 16, 16), new MeshStandardMaterial({
+            point.position.set(world_position.x, p * 3, world_position.z)
-                color: light.color,
-                emissive: light.color,
-                emissiveIntensity: 100
-            }))
-            point.position.set(light.position.x, light.position.y, light.position.z)
             point.name = `${element.id}_clickable`
-            // light.add(point)
+            point.renderOrder = 1
 
-            clickable_items.value.push(light)
             clickable_items.value.push(point)
             clickable_objects.value.push({
                 name: point.name,
@@ -162,8 +156,7 @@ watch(() => props.source, () => {
             </TresGroup>
         </template>
         <template v-for="item in clickable_items">
-            <TresObject3D v-if="item.type == 'PointLight'" v-bind="item.clone()" />
+            <TresMesh @click="() => openSidebar(item.name.replace('_clickable', ''))" v-bind="item.clone()" />
-            <TresMesh v-else @click="() => openSidebar(item.name.replace('_clickable', ''))" v-bind="item" />
         </template>
     </TresGroup>
 </template>