修改3D分布大屏 网络连线宽度
This commit is contained in:
hzz
parent
e7974b1e49
commit
c8f6fe23b6
@ -9,9 +9,11 @@ import * as TWEEN from '@tweenjs/tween.js';
|
||||
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
|
||||
import * as SceneUtils from 'three/examples/jsm/utils/SceneUtils.js';
|
||||
import { CSS2DRenderer, CSS2DObject } from 'three/examples/jsm/renderers/CSS2DRenderer.js';
|
||||
import { CSS3DRenderer, CSS3DObject } from 'three/examples/jsm/renderers/CSS3DRenderer.js';
|
||||
import { DragControls } from "@/utils/DragControls";
|
||||
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
|
||||
import { Line2 } from 'three/examples/jsm/lines/Line2'
|
||||
import { LineGeometry } from 'three/examples/jsm/lines/LineGeometry'
|
||||
import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial'
|
||||
import { useFactoryStore } from "@/store/module/Factory"
|
||||
import { useRouter } from 'vue-router';
|
||||
import { updateCoordinateByPoint } from "@/http/AerialView/index"
|
||||
@ -374,46 +376,49 @@ const init = () => {
|
||||
createGlb()
|
||||
/*放置交换机************/
|
||||
//汽车军团
|
||||
createSwitch({x:-287.44,y:0 ,z:19.24})
|
||||
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: -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: -40.22, y: 0, z: 19.90 })
|
||||
//服装军团
|
||||
createSwitch({x:-81.96,y:0 ,z:-283.33})
|
||||
createSwitch({ x: -81.96, y: 0, z: -283.33 })
|
||||
//电控分厂
|
||||
createSwitch({x:-232.96,y:0 ,z:-64.48})
|
||||
createSwitch({ x: -232.96, y: 0, z: -64.48 })
|
||||
//大配套中心
|
||||
createSwitch({x:29.01,y:0 ,z:-60.75})
|
||||
createSwitch({ x: 29.01, y: 0, z: -60.75 })
|
||||
//大件车间
|
||||
createSwitch({x:5.29,y:0 ,z:19.00})
|
||||
createSwitch({ x: 5.29, y: 0, z: 19.00 })
|
||||
//家纺 医防
|
||||
createSwitch({x:88.55,y:0 ,z:-214.89})
|
||||
createSwitch({ x: 88.55, y: 0, z: -214.89 })
|
||||
//二道岗
|
||||
createSwitch({x:306.5,y:0,z:5.43})
|
||||
createSwitch({ x: 306.5, y: 0, z: 5.43 })
|
||||
/*交换机结束********************************* */
|
||||
/*创建wifi */
|
||||
//机加
|
||||
createWifi({x:-46.96,y:2 ,z:156.57})
|
||||
createWifi({ x: -46.96, y: 2, z: 156.57 })
|
||||
//大件
|
||||
createWifi({x:52.60,y:2 ,z:96.44})
|
||||
createWifi({x:52.60,y:2 ,z:157.07})
|
||||
createWifi({ x: 52.60, y: 2, z: 96.44 })
|
||||
createWifi({ x: 52.60, y: 2, z: 157.07 })
|
||||
//精饰
|
||||
createWifi({x:133.14,y:2 ,z:107.43})
|
||||
createWifi({x:133.14,y:2 ,z:156.25})
|
||||
createWifi({ x: 133.14, y: 2, z: 107.43 })
|
||||
createWifi({ x: 133.14, y: 2, z: 156.25 })
|
||||
//焊接
|
||||
createWifi({x:305.73,y:2 ,z:110.45})
|
||||
createWifi({x:305.73,y:2 ,z:238.67})
|
||||
createWifi({ x: 305.73, y: 2, z: 110.45 })
|
||||
createWifi({ x: 305.73, y: 2, z: 238.67 })
|
||||
//服装
|
||||
createWifi({x:-89.13,y:4 ,z:-245.33})
|
||||
createWifi({x:-132.07,y:2 ,z:-245.33})
|
||||
createWifi({x:-222.31,y:2 ,z:-245.33})
|
||||
createWifi({ x: -89.13, y: 4, z: -245.33 })
|
||||
createWifi({ x: -132.07, y: 2, z: -245.33 })
|
||||
createWifi({ x: -222.31, y: 2, z: -245.33 })
|
||||
createWifi({x:-87.78,y:2 ,z:-114.15})
|
||||
createWifi({x:-176.45,y:2 ,z:-114.40})
|
||||
|
||||
//家纺 医防
|
||||
createWifi({x:140.83,y:2 ,z:-197.34})
|
||||
createWifi({x:259.37,y:2 ,z:-197.34})
|
||||
createWifi({x:140.83,y:2 ,z:-111.84})
|
||||
createWifi({x:259.50,y:2 ,z:-111.81})
|
||||
createWifi({ x: 140.83, y: 2, z: -197.34 })
|
||||
createWifi({ x: 259.37, y: 2, z: -197.34 })
|
||||
createWifi({ x: 140.83, y: 2, z: -111.84 })
|
||||
createWifi({ x: 259.50, y: 2, z: -111.81 })
|
||||
|
||||
|
||||
|
||||
@ -467,22 +472,22 @@ const init = () => {
|
||||
])
|
||||
//精加
|
||||
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}
|
||||
{ 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}
|
||||
{ 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}
|
||||
{ x: 53.43, y: 2, z: 53.16 },
|
||||
{ x: 53.43, y: 2, z: 154.31 }
|
||||
])
|
||||
|
||||
//电控
|
||||
@ -550,8 +555,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-0.83).toFixed(2) + ",y:2 ,z:" + (selected.point.z+3.52).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 - 0.83).toFixed(2) + ",y:2 ,z:" + (selected.point.z + 3.52).toFixed(2) + "}");
|
||||
let workerShop = intersects[0]?.object?.name
|
||||
if (workerShopRoute.hasOwnProperty(workerShop) && !edit) {
|
||||
//router.push({ path: workerShopRoute[workerShop] })
|
||||
@ -668,17 +673,37 @@ const init = () => {
|
||||
|
||||
//创建线
|
||||
function createLine(color: number, pointsList: any) {
|
||||
const material = new THREE.LineBasicMaterial({ color: color });
|
||||
const points = [];
|
||||
// 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);
|
||||
// scene.add(line);
|
||||
// renderer.render(scene, camera);
|
||||
|
||||
const geometry = new LineGeometry()
|
||||
let pointList = []
|
||||
pointsList.forEach(element => {
|
||||
points.push(new THREE.Vector3(element.x, element.y, element.z));
|
||||
let {x,y,z} = element
|
||||
let arr = [x,y,z]
|
||||
pointList.push(...arr)
|
||||
});
|
||||
|
||||
const geometry = new THREE.BufferGeometry().setFromPoints(points);
|
||||
const line = new THREE.Line(geometry, material);
|
||||
scene.add(line);
|
||||
renderer.render(scene, camera);
|
||||
|
||||
geometry.setPositions(pointList)
|
||||
|
||||
const material = new LineMaterial({
|
||||
color: color,
|
||||
linewidth: 5
|
||||
})
|
||||
material.resolution.set(iw, ih)
|
||||
// 5. 创建 Line2
|
||||
var line = new Line2(geometry, material);
|
||||
// 6. 计算下线条长度
|
||||
line.computeLineDistances();
|
||||
// 7. 添加到场景
|
||||
scene.add(line)
|
||||
}
|
||||
|
||||
//创建wifi
|
||||
@ -687,8 +712,7 @@ function createWifi(position: positionType) {
|
||||
|
||||
loader.load('/models/glb/tothefuture_wifi.glb', function (gltf) {
|
||||
const mesh = gltf.scene.children[0];
|
||||
console.log(mesh);
|
||||
|
||||
|
||||
const s = 0.3;
|
||||
mesh.scale.set(s, s, s);
|
||||
mesh.position.set(position.x, position.y, position.z);
|
||||
@ -705,12 +729,12 @@ function createWifi(position: positionType) {
|
||||
}
|
||||
|
||||
//创建交换机
|
||||
function createSwitch(position: positionType,scale:number=0.2) {
|
||||
function createSwitch(position: positionType, scale: number = 0.2) {
|
||||
const loader = new GLTFLoader();
|
||||
|
||||
loader.load('/models/gltf/scene.gltf', function (gltf) {
|
||||
const mesh = gltf.scene.children[0];
|
||||
|
||||
|
||||
const s = scale;
|
||||
mesh.scale.set(s, s, 0.5);
|
||||
mesh.position.set(position.x, position.y, position.z);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user