3d 모델 anchor 센터맞춤

src/components/map/mapbox/MapBoxMap.js

@@ -39,22 +39,38 @@ import uamGltf from './models/out.glb';
 import uamVertipad from './models/scene.glb';
 
 const ghlfkd = [
-  [126.6240164, 37.5643352, 0],
-  [126.6240164, 37.5643352, 30],
-  [126.6240164, 37.5643352, 60],
-  [126.6240164, 37.5643352, 90],
-  [126.6240164, 37.5643352, 120],
-  [126.6240164, 37.5643352, 150],
-  [126.62469825999999, 37.565102957777775, 150],
-  [126.62505012, 37.56597071555556, 150],
-  [126.62540197999999, 37.566838473333334, 150],
-  [126.62575384, 37.56770623111111, 150],
-  [126.6261057, 37.568573988888886, 150],
-  [126.62645755999999, 37.56944174666667, 150],
-  [126.62680942, 37.570309504444445, 150],
-  [126.62716128, 37.57117726222222, 150],
-  [126.62751314, 37.572045020000004, 150],
-  [126.627865, 37.57291277777778, 150]
+  [126.6243464, 37.5642352, 0],
+  [126.6243464, 37.5642352, 30],
+  [126.6243464, 37.5642352, 60],
+  [126.6243464, 37.5642352, 90],
+  [126.6243464, 37.5642352, 120],
+  [126.6243464, 37.5642352, 150],
+  [126.6243464, 37.5642352, 180],
+  [126.6243464, 37.5642352, 210],
+  [126.6243464, 37.5642352, 240],
+  [126.6243464, 37.5642352, 270],
+  [126.6243464, 37.5642352, 300],
+  [126.6243464, 37.5642352, 330],
+  [126.6243464, 37.5642352, 360],
+  [126.6243464, 37.5642352, 390],
+  [126.6243464, 37.5642352, 420],
+  [126.6243464, 37.5642352, 450],
+  [126.6243464, 37.5642352, 480],
+  [126.6243464, 37.5642352, 510],
+  [126.6243464, 37.5642352, 540],
+  [126.6243464, 37.5642352, 570],
+  [126.6243464, 37.5642352, 600],
+
+  [126.62469825999999, 37.565102957777775, 600],
+  [126.62505012, 37.56597071555556, 600],
+  [126.62540197999999, 37.566838473333334, 600],
+  [126.62575384, 37.56770623111111, 600],
+  [126.6261057, 37.568573988888886, 600],
+  [126.62645755999999, 37.56944174666667, 600],
+  [126.62680942, 37.570309504444445, 600],
+  [126.62716128, 37.57117726222222, 600],
+  [126.62751314, 37.572045020000004, 600],
+  [126.627865, 37.57291277777778, 600]
 ];
 let gridCoords = [];
 let altitudeMarker = [];
@@ -473,7 +489,8 @@ export default function MapBoxMap() {
             type: 'gltf', // 3D Model 확장자 타입
             scale: { x: 0, y: 0, z: 0 }, // 3D Model 크기 값
             units: 'meters', // 높이 단위
-            rotation: { x: 90, y: -90, z: 0 } // // 3D Model 방향 각도 초기 값
+            rotation: { x: 90, y: -90, z: 0 }, // // 3D Model 방향 각도 초기 값
+            anchor: 'center'
           };
 
           tb.loadObj(options, model => {
@@ -573,7 +590,7 @@ export default function MapBoxMap() {
         }
       });
       const uamRouteArr = [
-        [126.62344452564807, 37.56537917231002],
+        [126.6243464, 37.5642352],
         [126.8045935, 37.56016]
       ];
 
@@ -589,7 +606,8 @@ export default function MapBoxMap() {
               type: 'gltf', // 3D Model 확장자 타입
               scale: { x: 10, y: 10, z: 10 }, // 3D Model 크기 값
               units: 'meters', // 높이 단위
-              rotation: { x: 90, y: -90, z: 0 } // // 3D Model 방향 각도 초기 값
+              rotation: { x: 90, y: -90, z: 0 }, // // 3D Model 방향 각도 초기 값
+              anchor: 'center'
             };
             tb.loadObj(options, model => {
               let longitude = uamRouteArr[i][0]; // 3D Model 경도 값
@@ -652,7 +670,7 @@ export default function MapBoxMap() {
               j < uamRouteLoad[i].geometry.coordinates.length;
               j++
             ) {
-              uamRouteLoad[i].geometry.coordinates[j].push(150);
+              uamRouteLoad[i].geometry.coordinates[j].push(600);
             }
 
             const options = {