|
|
|
@ -3,6 +3,7 @@ import BaseRenderer from '@/core/base/BaseRenderer.ts' |
|
|
|
import { Line2 } from 'three/examples/jsm/lines/Line2.js' |
|
|
|
import { LineGeometry } from 'three/examples/jsm/lines/LineGeometry.js' |
|
|
|
import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial.js' |
|
|
|
import * as BufferGeometryUtils from "three/addons/utils/BufferGeometryUtils.js"; |
|
|
|
import { decimalSumBy } from '@/core/ModelUtils' |
|
|
|
import Constract from '@/core/Constract.ts' |
|
|
|
import Plastic_Rough_JPG from '@/assets/Models/Plastic_Rough.jpg' |
|
|
|
@ -155,41 +156,66 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
rackVerticalBarGeometry: BufferGeometry = null |
|
|
|
rackVerticalBarMaterial: Material = null |
|
|
|
|
|
|
|
rackLinkBarColor = 0xFF35499C |
|
|
|
rackLinkBarGeometry: BufferGeometry = null |
|
|
|
rackLinkBarMaterial: Material = null |
|
|
|
|
|
|
|
rackHorizontalBarWidth = 0.1 |
|
|
|
rackHorizontalBarDepth = 0.08 |
|
|
|
rackHorizontalBarColor = 0xFFF97F27 |
|
|
|
rackHorizontalBarGeometry: BufferGeometry = null |
|
|
|
rackHorizontalBarMaterial: Material = null |
|
|
|
|
|
|
|
sectionPoints = [ |
|
|
|
bottomBarHeight = 0.2 |
|
|
|
bottomLinkHeight = 0.2 |
|
|
|
|
|
|
|
barSectionPoints = [ |
|
|
|
{x: -0.05, y: -0.05}, |
|
|
|
{x: -0.025, y: -0.05}, |
|
|
|
{x: 0.04-0.05, y: 0.005-0.05}, |
|
|
|
{x: 0.06-0.05, y: 0.005-0.05}, |
|
|
|
{x: 0.075-0.05, y: 0-0.05}, |
|
|
|
{x: 0.1-0.05, y: 0-0.05}, |
|
|
|
{x: 0.1-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0.092-0.05, y: 0.1-0.05}, |
|
|
|
{x: 0.075-0.05, y: 0.1-0.05}, |
|
|
|
{x: 0.075-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0.092-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0.092-0.05, y: 0.008-0.05}, |
|
|
|
{x: 0.008-0.05, y: 0.008-0.05}, |
|
|
|
{x: 0.008-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0.025-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0.025-0.05, y: 0.1-0.05}, |
|
|
|
{x: 0.008-0.05, y: 0.1-0.05}, |
|
|
|
{x: 0-0.05, y: 0.092-0.05}, |
|
|
|
{x: 0-0.05, y: 0-0.05} |
|
|
|
{x: -0.01, y: -0.045}, |
|
|
|
{x: 0.05, y: -0.045}, |
|
|
|
{x: 0.025, y: -0.05}, |
|
|
|
{x: 0.05, y: -0.05}, |
|
|
|
{x: 0.05, y: 0.042}, |
|
|
|
{x: 0.042, y: 0.05}, |
|
|
|
{x: 0.025, y: 0.05}, |
|
|
|
{x: 0.025, y: 0.042}, |
|
|
|
{x: 0.042, y: 0.042}, |
|
|
|
{x: 0.042, y: -0.042}, |
|
|
|
{x: -0.042, y: -0.042}, |
|
|
|
{x: -0.042, y: 0.042}, |
|
|
|
{x: -0.025, y: 0.042}, |
|
|
|
{x: -0.025, y: 0.05}, |
|
|
|
{x: -0.042, y: 0.05}, |
|
|
|
{x: -0.05, y: 0.042}, |
|
|
|
{x: -0.05, y: -0.05} |
|
|
|
] |
|
|
|
|
|
|
|
linkSectionPoints = [ |
|
|
|
{x: -0.05, y: -0.05}, |
|
|
|
{x: -0.05, y: 0.05}, |
|
|
|
{x: 0, y: 0.05}, |
|
|
|
{x: 0, y: 0.06}, |
|
|
|
{x: -0.06, y: 0.06}, |
|
|
|
{x: -0.06, y: -0.05}, |
|
|
|
{x: -0.05, y: -0.05} |
|
|
|
] |
|
|
|
|
|
|
|
linkBarSectionPoints = [ |
|
|
|
{x: -0.025, y: -0.025}, |
|
|
|
{x: 0.025, y: -0.025}, |
|
|
|
{x: 0.025, y: 0.025}, |
|
|
|
{x: -0.025, y: 0.025}, |
|
|
|
{x: -0.025, y: -0.025} |
|
|
|
] |
|
|
|
|
|
|
|
createVerticalBar(x, y, z, length): THREE.BufferGeometry { |
|
|
|
|
|
|
|
// 创建一个形状 柱子的截面形状
|
|
|
|
const shape = new THREE.Shape(); |
|
|
|
shape.moveTo(this.sectionPoints[0].x, this.sectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.sectionPoints.length; i++) { |
|
|
|
shape.lineTo(this.sectionPoints[i].x , this.sectionPoints[i].y); |
|
|
|
shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.barSectionPoints.length; i++) { |
|
|
|
shape.lineTo(this.barSectionPoints[i].x , this.barSectionPoints[i].y); |
|
|
|
} |
|
|
|
|
|
|
|
// 拉伸轨迹线
|
|
|
|
@ -243,18 +269,110 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
return material; |
|
|
|
} |
|
|
|
|
|
|
|
createLinkBar(x, y, z, vBarLength, depth, bottomDistance, topDistance): THREE.BufferGeometry { |
|
|
|
|
|
|
|
const bgs: BufferGeometry[] = [] |
|
|
|
const top = vBarLength - topDistance |
|
|
|
// 创建一个形状 柱子的截面形状
|
|
|
|
const shape = new THREE.Shape(); |
|
|
|
shape.moveTo(this.linkBarSectionPoints[0].x, this.linkBarSectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.linkBarSectionPoints.length; i++) { |
|
|
|
shape.lineTo(this.linkBarSectionPoints[i].x, this.linkBarSectionPoints[i].y); |
|
|
|
} |
|
|
|
|
|
|
|
// 拉伸轨迹线 横向 底部
|
|
|
|
const curveHBottom = new THREE.CatmullRomCurve3( |
|
|
|
[new THREE.Vector3(0, bottomDistance, 0), new THREE.Vector3(0, bottomDistance, depth)], |
|
|
|
false, // 闭合曲线
|
|
|
|
'catmullrom', |
|
|
|
0 |
|
|
|
); |
|
|
|
|
|
|
|
// 挤出几何图形 参数
|
|
|
|
const optionsHBottom = { |
|
|
|
steps: 1, |
|
|
|
bevelEnabled: false, |
|
|
|
extrudePath: curveHBottom, // 设置挤出轨迹
|
|
|
|
}; |
|
|
|
|
|
|
|
// 拉伸轨迹线 横向 底部
|
|
|
|
const curveHTop = new THREE.CatmullRomCurve3( |
|
|
|
[new THREE.Vector3(0, top, 0), new THREE.Vector3(0, top, depth)], |
|
|
|
false, // 闭合曲线
|
|
|
|
'catmullrom', |
|
|
|
0 |
|
|
|
); |
|
|
|
|
|
|
|
// 挤出几何图形 参数
|
|
|
|
const optionsHTop = { |
|
|
|
steps: 1, |
|
|
|
bevelEnabled: false, |
|
|
|
extrudePath: curveHTop, // 设置挤出轨迹
|
|
|
|
}; |
|
|
|
|
|
|
|
// 创建挤出几何体
|
|
|
|
const geometryHBottom = new THREE.ExtrudeGeometry(shape, optionsHBottom); |
|
|
|
const geometryHTop = new THREE.ExtrudeGeometry(shape, optionsHTop); |
|
|
|
bgs.push(geometryHBottom, geometryHTop) |
|
|
|
|
|
|
|
let remainingHeight = vBarLength - bottomDistance - topDistance |
|
|
|
|
|
|
|
// 需要创建斜杆
|
|
|
|
|
|
|
|
for (let i = 0; i < Math.floor(remainingHeight / depth); i++) { |
|
|
|
// 拉伸轨迹线 斜向
|
|
|
|
const curveD = new THREE.CatmullRomCurve3( |
|
|
|
(i%2 == 0) ? [new THREE.Vector3(0, bottomDistance + depth * i, 0), new THREE.Vector3(0, bottomDistance + depth * (i+1), depth)] |
|
|
|
: [new THREE.Vector3(0, bottomDistance + depth * (i+1), 0), new THREE.Vector3(0, bottomDistance + depth * (i), depth)], |
|
|
|
false, // 闭合曲线
|
|
|
|
'catmullrom', |
|
|
|
0 |
|
|
|
); |
|
|
|
|
|
|
|
const optionsD = { |
|
|
|
steps: 1, |
|
|
|
bevelEnabled: false, |
|
|
|
extrudePath: curveD, // 设置挤出轨迹
|
|
|
|
}; |
|
|
|
|
|
|
|
const geometryD = new THREE.ExtrudeGeometry(shape, optionsD); |
|
|
|
bgs.push(geometryD) |
|
|
|
} |
|
|
|
|
|
|
|
if (vBarLength - bottomDistance - topDistance > depth) { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
// 调整uv方便正确贴图
|
|
|
|
// this.resetUVs(geometry);
|
|
|
|
return BufferGeometryUtils.mergeGeometries(bgs) |
|
|
|
} |
|
|
|
|
|
|
|
createLinkBarMaterial(): THREE.Material { |
|
|
|
|
|
|
|
const material = new THREE.MeshPhongMaterial(); |
|
|
|
material.color.setHex(this.rackLinkBarColor, "srgb"); |
|
|
|
material.specular.setHex(0xff6d6d6d, 'srgb'); |
|
|
|
material.transparent = true; |
|
|
|
material.needsUpdate = true; |
|
|
|
|
|
|
|
return material; |
|
|
|
} |
|
|
|
|
|
|
|
createHorizontalBar(x, y, z, length): THREE.BufferGeometry { |
|
|
|
|
|
|
|
// 创建一个形状 柱子的截面形状
|
|
|
|
const shape = new THREE.Shape(); |
|
|
|
shape.moveTo(this.sectionPoints[0].x, this.sectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.sectionPoints.length; i++) { |
|
|
|
shape.lineTo(this.sectionPoints[i].x , this.sectionPoints[i].y); |
|
|
|
shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.barSectionPoints.length; i++) { |
|
|
|
shape.lineTo(this.barSectionPoints[i].x , this.barSectionPoints[i].y); |
|
|
|
} |
|
|
|
|
|
|
|
// 拉伸轨迹线
|
|
|
|
const curve = new THREE.CatmullRomCurve3( |
|
|
|
[new THREE.Vector3(0, 0, 0), new THREE.Vector3(length, 0, 0)], |
|
|
|
[new THREE.Vector3(0.05, 0, 0), new THREE.Vector3(length -0.05, 0, 0)], |
|
|
|
false, // 闭合曲线
|
|
|
|
'catmullrom', |
|
|
|
0 |
|
|
|
@ -268,9 +386,41 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
}; |
|
|
|
// 创建挤出几何体
|
|
|
|
const geometry = new THREE.ExtrudeGeometry(shape, options); |
|
|
|
|
|
|
|
const linkShapeL = new THREE.Shape(); |
|
|
|
const linkShapeR = new THREE.Shape(); |
|
|
|
linkShapeL.moveTo(this.linkSectionPoints[0].x, this.linkSectionPoints[0].y); |
|
|
|
linkShapeR.moveTo(this.linkSectionPoints[0].x + (length), this.linkSectionPoints[0].y); |
|
|
|
for (let i = 1; i < this.linkSectionPoints.length; i++) { |
|
|
|
linkShapeL.lineTo(this.linkSectionPoints[i].x , this.linkSectionPoints[i].y); |
|
|
|
linkShapeR.lineTo(this.linkSectionPoints[i].x + (length), this.linkSectionPoints[i].y); |
|
|
|
} |
|
|
|
|
|
|
|
// 拉伸轨迹线
|
|
|
|
const linkCurve = new THREE.CatmullRomCurve3( |
|
|
|
[new THREE.Vector3(0, 0, -0.08), new THREE.Vector3(0, 0, 0.08)], |
|
|
|
false, // 闭合曲线
|
|
|
|
'catmullrom', |
|
|
|
0 |
|
|
|
); |
|
|
|
|
|
|
|
// 挤出几何图形 参数
|
|
|
|
const linkOptions = { |
|
|
|
steps: 1, |
|
|
|
bevelEnabled: false, |
|
|
|
extrudePath: linkCurve, // 设置挤出轨迹
|
|
|
|
}; |
|
|
|
// 创建挤出几何体
|
|
|
|
const linkGeometryL = new THREE.ExtrudeGeometry(linkShapeL, linkOptions); |
|
|
|
linkGeometryL.rotateZ(-Math.PI / 2) |
|
|
|
const linkGeometryR = new THREE.ExtrudeGeometry(linkShapeR, linkOptions); |
|
|
|
linkGeometryR.rotateX(-Math.PI) |
|
|
|
linkGeometryR.rotateZ(-Math.PI / 2) |
|
|
|
|
|
|
|
|
|
|
|
// 调整uv方便正确贴图
|
|
|
|
this.resetUVs(geometry); |
|
|
|
return geometry |
|
|
|
// this.resetUVs(geometry);
|
|
|
|
return BufferGeometryUtils.mergeGeometries([geometry, linkGeometryL, linkGeometryR]) |
|
|
|
} |
|
|
|
|
|
|
|
createHorizontalBarMaterial(): THREE.Material { |
|
|
|
@ -307,6 +457,9 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
// 计算立住坐标点和长度
|
|
|
|
const vBarMatrix: {x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number}[] = []; |
|
|
|
|
|
|
|
// 计算
|
|
|
|
const linkBarMatrix: {x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number}[] = []; |
|
|
|
|
|
|
|
let distanceX = 0, distanceY = 0; |
|
|
|
|
|
|
|
for (let i = -1; i < item.dt.bays.length; i++) { |
|
|
|
@ -338,16 +491,31 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
rz: 0, |
|
|
|
l: rackHeight |
|
|
|
}) |
|
|
|
linkBarMatrix.push({ |
|
|
|
x: rackPoint.x + distanceX, |
|
|
|
y: rackPoint.y, |
|
|
|
z: i%2 == 0 ? (rackPoint.z + item.dt.rackDepth) : rackPoint.z, |
|
|
|
sx: 1, |
|
|
|
sy: 1, |
|
|
|
sz: 1, |
|
|
|
rx: 0, |
|
|
|
ry: i%2 == 0 ? Math.PI : 0, |
|
|
|
rz: 0, |
|
|
|
l: rackHeight |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
// 计算横梁数量
|
|
|
|
const hBarMatrix: {x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number}[] = []; |
|
|
|
distanceX = 0; |
|
|
|
for (let i = 0; i < item.dt.bays.length; i++) { |
|
|
|
distanceY = 0; |
|
|
|
distanceY = this.bottomBarHeight; |
|
|
|
const bay = item.dt.bays[i] |
|
|
|
for (let j = 0; j < bay.levelHeight.length; j++) { |
|
|
|
const levelHeight = bay.levelHeight[j] |
|
|
|
if (distanceY <= 0) { |
|
|
|
continue |
|
|
|
} |
|
|
|
hBarMatrix.push({ |
|
|
|
x: rackPoint.x + distanceX, |
|
|
|
y: rackPoint.y + distanceY, |
|
|
|
@ -399,6 +567,26 @@ export default class RackRenderer extends BaseRenderer { |
|
|
|
meshes.push(vBarMesh) |
|
|
|
} |
|
|
|
|
|
|
|
if (linkBarMatrix.length > 0) { |
|
|
|
if (!this.rackLinkBarGeometry) { |
|
|
|
this.rackLinkBarGeometry = this.createLinkBar(linkBarMatrix[0].x, linkBarMatrix[0].y, linkBarMatrix[0].z, rackHeight, item.dt.rackDepth, this.bottomLinkHeight, 0.2) |
|
|
|
} |
|
|
|
if (!this.rackLinkBarMaterial) { |
|
|
|
this.rackLinkBarMaterial = this.createLinkBarMaterial() |
|
|
|
} |
|
|
|
const dummy = new THREE.Object3D(); |
|
|
|
const linkBarMesh = new THREE.InstancedMesh(this.rackLinkBarGeometry, this.rackLinkBarMaterial, linkBarMatrix.length); |
|
|
|
for (let i = 0; i < linkBarMatrix.length; i++) { |
|
|
|
const lp = linkBarMatrix[i] |
|
|
|
dummy.position.set(lp.x, lp.y, lp.z); |
|
|
|
dummy.rotation.set(lp.rx, lp.ry, lp.rz); |
|
|
|
dummy.scale.set(lp.sx, lp.sy, lp.sz); |
|
|
|
dummy.updateMatrix(); |
|
|
|
linkBarMesh.setMatrixAt(i, dummy.matrix); |
|
|
|
} |
|
|
|
meshes.push(linkBarMesh) |
|
|
|
} |
|
|
|
|
|
|
|
if (hBarMatrix.length > 0) { |
|
|
|
if (!this.rackHorizontalBarGeometry) { |
|
|
|
this.rackHorizontalBarGeometry = this.createHorizontalBar(hBarMatrix[0].x, hBarMatrix[0].y, hBarMatrix[0].z, hBarMatrix[0].l) |
|
|
|
|