diff --git a/src/views/FactoryView/threeMap.vue b/src/views/FactoryView/threeMap.vue index 5b2168f..a153ad2 100644 --- a/src/views/FactoryView/threeMap.vue +++ b/src/views/FactoryView/threeMap.vue @@ -372,69 +372,106 @@ const init = () => { createTitleFloor('', 464, 45, { x: 0, y: 0, z: 15 }) //放置服务器 createGlb() - - //创建红线 - let redLine = 0xff0000; - createLine(redLine,[{x:-346.00,y:23.6,z:59.40},{x:-160.50,y:0,z:134.08}]) - //服装 - createLine(redLine,[ - {x:-345.65,y:23.3,z:36.40}, - {x:22.67,y:2,z:36.40}, - {x:22.67,y:2,z:-25.70}, - {x:-47.67,y:2,z:-25.70}, - {x:-47.67,y:2,z:-248.85}, - {x:-221.76,y:2,z:-248.85} - ]) - createLine(redLine,[{x:-47.67,y:2,z:-117.33},{x:-174.65,y:2,z:-117.33}]) + /*放置交换机************/ //汽车军团 - createLine(redLine,[{x:-293.44,y:0,z:52.52},{x:-293.44,y:19.28,z:36.40},{x:-235.84,y:0,z:-30.87}]) + createSwitch({x:-287.44,y:0 ,z:19.24}) + //精加车间 + createSwitch({x:-158.01,y:0 ,z:107.47}) + createSwitch({x:-208.35,y:0 ,z:107.47}) + //机加车间 + createSwitch({x:-40.22,y:0 ,z:19.90}) + //电控分厂 + createSwitch({x:-232.96,y:0 ,z:-64.48}) + //大配套中心 + createSwitch({x:29.01,y:0 ,z:-60.75}) + //大件车间 + createSwitch({x:5.29,y:0 ,z:19.00}) + //家纺 医防 + createSwitch({x:88.55,y:0 ,z:-214.89}) + + + /*创建红线******************/ + let redLine = 0xff0000; + createLine(redLine, [{ x: -346.00, y: 23.6, z: 59.40 }, { x: -160.50, y: 2, z: 142.08 }]) + //服装 + createLine(redLine, [ + { x: -345.65, y: 2, z: 36.40 }, + { x: 22.67, y: 2, z: 36.40 }, + { x: 22.67, y: 2, z: -25.70 }, + { x: -47.67, y: 2, z: -25.70 }, + { x: -47.67, y: 2, z: -248.85 }, + { x: -221.76, y: 2, z: -248.85 } + ]) + createLine(redLine, [{ x: -47.67, y: 2, z: -117.33 }, { x: -174.65, y: 2, z: -117.33 }]) + //汽车军团 + createLine(redLine, [{ x: -293.44, y: 2, z: 52.52 }, { x: -293.44, y: 2, z: 36.40 }, { x: -235.84, y: 2, z: -30.87 }]) //机加 - createLine(redLine,[ - {x:-114.64,y:2,z:36.40}, - {x:-114.64,y:2,z:52.42}, - {x:-46.13,y:2,z:52.90}, - {x:-46.13,y:2,z:153.05} + createLine(redLine, [ + { x: -114.64, y: 2, z: 36.40 }, + { x: -114.64, y: 2, z: 52.42 }, + { x: -46.13, y: 2, z: 52.90 }, + { x: -46.13, y: 2, z: 153.05 } ]) //家纺医防 - createLine(redLine,[ - {x:27.47,y:2,z:-26.11}, - {x:27.47,y:2,z:-248.85}, - {x:69.26,y:2,z:-248.85}, - {x:69.26,y:2,z:-180.29}, - {x:85.51,y:2,z:-180.29}, - {x:141.66,y:2,z:-200.86}, - {x:260.42,y:2,z:-200.86}, - {x:260.42,y:2,z:-115.33}, - {x:141.66,y:2,z:-115.33}, - {x:141.66,y:2,z:-200.86}, + createLine(redLine, [ + { x: 27.47, y: 2, z: -26.11 }, + { x: 27.47, y: 2, z: -248.85 }, + { x: 69.26, y: 2, z: -248.85 }, + { x: 69.26, y: 2, z: -180.29 }, + { x: 85.51, y: 2, z: -180.29 }, + { x: 141.66, y: 2, z: -200.86 }, + { x: 260.42, y: 2, z: -200.86 }, + { x: 260.42, y: 2, z: -115.33 }, + { x: 141.66, y: 2, z: -115.33 }, + { x: 141.66, y: 2, z: -200.86 }, ]) //创建黄线 let yellowLine = 0xffff00; //横线 主干道 - createLine(yellowLine,[ - {x:-341.87,y:2,z:30.98}, - {x:111.97,y:2,z:30.98}, - {x:111.97,y:2,z:175.55}, - {x:294.54,y:2,z:175.55}, - {x:294.54,y:2,z:40.43}, - {x:306.56,y:2,z:40.43}, - {x:306.56,y:2,z:235.28} + createLine(yellowLine, [ + { x: -341.87, y: 2, z: 30.98 }, + { x: 111.97, y: 2, z: 30.98 }, + { x: 111.97, y: 2, z: 175.55 }, + { x: 294.54, y: 2, z: 175.55 }, + { x: 294.54, y: 2, z: 40.43 }, + { x: 306.56, y: 2, z: 40.43 }, + { x: 306.56, y: 2, z: 235.28 } ]) + //精加 + createLine(yellowLine, [ + {x:-164.26,y:2,z:30.98}, + {x:-164.26,y:2,z:140.05}, + {x:-214.35,y:2,z:140.05} + + ]) + //大件 总---精饰 + createLine(yellowLine, [ + {x:-0.71,y:2,z:30.98}, + {x:-0.71,y:2,z:53.16}, + {x:133.97,y:2,z:53.16}, + {x:133.97,y:2,z:154.31} + ]) + //大件 分 + createLine(yellowLine, [ + {x:53.43,y:2,z:53.16}, + {x:53.43,y:2,z:154.31} + ]) + //电控 - createLine(yellowLine,[ - {x:-292.24,y:2,z:30.98}, - {x:-242.61,y:2,z:-30.90} + createLine(yellowLine, [ + { x: -292.24, y: 2, z: 30.98 }, + { x: -242.61, y: 2, z: -30.90 } ]) //家纺 医防 - createLine(yellowLine,[ - {x:18.30,y:2,z:30.98}, - {x:18.30,y:2,z:-28.94}, - {x:25.64,y:2,z:-28.94}, - {x:25.64,y:2,z:-251.40}, - {x:71.44,y:2,z:-251.40}, - {x:71.44,y:2,z:-183.05}, - {x:83.96,y:2,z:-183.05} + createLine(yellowLine, [ + { x: 18.30, y: 2, z: 30.98 }, + { x: 18.30, y: 2, z: -28.94 }, + { x: 25.64, y: 2, z: -28.94 }, + { x: 25.64, y: 2, z: -251.40 }, + { x: 71.44, y: 2, z: -251.40 }, + { x: 71.44, y: 2, z: -183.05 }, + { x: 83.96, y: 2, z: -183.05 } ]) setTipDom() @@ -472,8 +509,8 @@ const init = () => { //width、height表示canvas画布宽高度 const x = (px / iw) * 2 - 1; const y = -(py / ih) * 2 + 1; - console.log("鼠标点击位置", "x:" + x, "y:" + y); - console.log("鼠标点击位置", "px:" + px, "py:" + py); + // console.log("鼠标点击位置", "x:" + x, "y:" + y); + // console.log("鼠标点击位置", "px:" + px, "py:" + py); //创建一个射线投射器`Raycaster` @@ -486,7 +523,8 @@ const init = () => { const intersects = raycaster.intersectObjects(scene.children); if (intersects.length > 0) { var selected = intersects[0]; //取第一个物体 - console.log("坐标", "{x:" + selected.point.x.toFixed(2) + ",y:" + (selected.point.y.toFixed(2) - 1) + ",z:" + selected.point.z.toFixed(2) + "}"); + // console.log("坐标", "{x:" + selected.point.x.toFixed(2) + ",y:" + (selected.point.y.toFixed(2) - 1) + ",z:" + selected.point.z.toFixed(2)+ "}"); + console.log("非正常坐标", "{x:" + (+selected.point.x+6).toFixed(2) + ",y:0 ,z:" + (selected.point.z-33).toFixed(2)+ "}"); let workerShop = intersects[0]?.object?.name if (workerShopRoute.hasOwnProperty(workerShop) && !edit) { //router.push({ path: workerShopRoute[workerShop] }) @@ -602,12 +640,12 @@ const init = () => { //创建线 -function createLine(color: number,pointsList: any) { +function createLine(color: number, pointsList: any) { const material = new THREE.LineBasicMaterial({ color: color }); const points = []; pointsList.forEach(element => { points.push(new THREE.Vector3(element.x, element.y, element.z)); - }); + }); const geometry = new THREE.BufferGeometry().setFromPoints(points); const line = new THREE.Line(geometry, material); @@ -615,6 +653,29 @@ function createLine(color: number,pointsList: any) { renderer.render(scene, camera); } + +//创建交换机 +function createSwitch(position: positionType) { + const loader = new GLTFLoader(); + + loader.load('/models/gltf/scene.gltf', function (gltf) { + const mesh = gltf.scene.children[0]; + + const s = 0.2; + mesh.scale.set(s, s, 0.5); + mesh.position.set(position.x, position.y, position.z); + // mesh.rotation.z = THREE.MathUtils.degToRad(180) + mesh.castShadow = true; + mesh.receiveShadow = true; + scene.add(mesh); + + }, undefined, function (error) { + + console.error(error); + + }); +} + //创建服务器 function createGlb() { const loader = new GLTFLoader();