yuliang
/
yvan-rcs-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

InstanceMeshManager

master
修宁 6 months ago
parent
c5386dc41d
commit
56fd1d7219
4 changed files with 332 additions and 174 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 14
      src/core/manager/InstanceMeshBlock.ts
  2. 151
      src/core/manager/InstanceMeshManager.ts
  3. 9
      src/core/manager/InstancePointManager.ts
  4. 332
      src/modules/rack/RackRenderer.ts

14
src/core/manager/InstanceMeshBlock.ts
View File

@ -18,16 +18,16 @@ export default class InstanceMeshBlock {
return this.freeIndices.pop() // Return the last free index return this.freeIndices.pop() // Return the last free index
} }
constructor(name: string, allowSelect: boolean, allowDrag: boolean, viewport: Viewport, constructor(itemTypeName: string, allowSelect: boolean, allowDrag: boolean, viewport: Viewport,
geometry: THREE.BufferGeometry, material: THREE.Material, geometry: THREE.BufferGeometry, material: THREE.Material,
blockIndex: number, capacity: number) { blockIndex: number, capacity: number) {
this.name = name this.name = itemTypeName
this.blockIndex = blockIndex this.blockIndex = blockIndex
this.viewport = viewport this.viewport = viewport
this.instancedMesh = new THREE.InstancedMesh(geometry, material, capacity) this.instancedMesh = new THREE.InstancedMesh(geometry, material, capacity)
this.instancedMesh.instanceMatrix.setUsage(THREE.DynamicDrawUsage) this.instancedMesh.instanceMatrix.setUsage(THREE.DynamicDrawUsage)
console.log('createBlock: [' + blockIndex + '] created with capacity:', capacity) console.log('createBlock: ' + itemTypeName + '[' + blockIndex + '] capacity:', capacity)
viewport.scene.add(this.instancedMesh) viewport.scene.add(this.instancedMesh)
if (allowSelect) { if (allowSelect) {
this.viewport.entityManager._selectableObjects.push(this.instancedMesh) this.viewport.entityManager._selectableObjects.push(this.instancedMesh)
@ -36,8 +36,12 @@ export default class InstanceMeshBlock {
this.viewport.entityManager._draggableObjects.push(this.instancedMesh) this.viewport.entityManager._draggableObjects.push(this.instancedMesh)
} }
this.instancedMesh.userData.t = name this.instancedMesh.userData.t = itemTypeName
this.instancedMesh.userData.entityId = 'InstanceMeshBlock_' + name + '_' + blockIndex this.instancedMesh.userData.entityId = 'InstanceMeshBlock_' + itemTypeName + '_' + blockIndex
_.extend(this.instancedMesh.userData,{
t: itemTypeName,
blockIndex: blockIndex
})
const dummy = new THREE.Object3D() const dummy = new THREE.Object3D()
dummy.scale.set(0, 0, 0) dummy.scale.set(0, 0, 0)

151
src/core/manager/InstanceMeshManager.ts
View File

@ -0,0 +1,151 @@
import * as THREE from 'three'
import type Viewport from '@/core/engine/Viewport.ts'
import InstanceMeshBlock from '@/core/manager/InstanceMeshBlock.ts'
import { PointManageWrap } from '@/core/manager/InstancePointManager.ts'
export default class InstanceMeshManager {
private __uuidMap = new Map<string, InstanceMeshWrap>()
public readonly name: string
public readonly viewport: Viewport
public readonly allowSelect: boolean
public readonly allowDrag: boolean
public readonly blockCapacity: number = 1000 // 每个 block 的容量
public readonly blocks: InstanceMeshBlock[] = []
private readonly geometry: THREE.BufferGeometry
private readonly material: THREE.Material
private readonly dummy: THREE.Object3D = new THREE.Object3D()
constructor(name: string, viewport: Viewport, allowSelect: boolean, allowDrag: boolean,
geometry: THREE.BufferGeometry, material: THREE.Material) {
this.name = name
this.viewport = viewport
this.allowSelect = allowSelect
this.allowDrag = allowDrag
this.geometry = geometry
this.material = material
}
/**
* 获取点实例数据
*/
findByMeshInstanceId(blockIndex: number, instanceId: number): InstanceMeshWrap {
if (!this.blocks[blockIndex]) {
console.error('InstancePointManager: Invalid blockIndex', blockIndex)
return null
}
const uuid = this.blocks[blockIndex].__indexIdMap.get(instanceId)
if (!uuid) return
return this.__uuidMap.get(uuid)
}
create(entityId: string): InstanceMeshWrap {
let meshIndex = -1
let blockIndex = -1
for (const block of this.blocks) {
meshIndex = block.getFreeMeshIndex()
if (meshIndex >= 0) {
blockIndex = block.blockIndex
break
}
}
// 所有 block 都没有空闲索引，创建新的 block
if (meshIndex < 0) {
const block = this.createBlock()
meshIndex = block.getFreeMeshIndex()
blockIndex = block.blockIndex
}
if (meshIndex < 0) {
system.showErrorDialog('InstancePointManager: No free index available after creating new block')
return null
}
return new InstanceMeshWrap(entityId, this, blockIndex, meshIndex)
}
delete(wrap: InstanceMeshWrap) {
const block = this.blocks[wrap.blockIndex]
if (!block) {
console.warn(`InstanceMeshManager: Block ${wrap.blockIndex} not found for wrap ${wrap.uuid}`)
return
}
// 隐藏实例
this.dummy.scale.set(0, 0, 0)
this.dummy.updateMatrix()
block.instancedMesh.setMatrixAt(wrap.meshIndex, this.dummy.matrix)
block.instancedMesh.instanceMatrix.needsUpdate = true
// 回收索引
block.freeIndices.push(wrap.meshIndex)
this.__uuidMap.delete(wrap.uuid)
block.__indexIdMap.delete(wrap.meshIndex)
wrap.dispose()
}
// 创建新的 InstanceMeshBlock
createBlock(): InstanceMeshBlock {
const blockIndex = this.blocks.length
const block = new InstanceMeshBlock(this.name, this.allowSelect, this.allowDrag,
this.viewport, this.geometry, this.material,
blockIndex, this.blockCapacity)
this.blocks.push(block)
return block
}
setBlockMatrixAt(wrap: InstanceMeshWrap, matrix: THREE.Matrix4) {
const block = this.blocks[wrap.blockIndex]
if (!block) {
console.warn(`InstanceMeshManager: Block ${wrap.blockIndex} not found!`)
return
}
this.__uuidMap.set(wrap.uuid, wrap)
block.instancedMesh.setMatrixAt(wrap.meshIndex, matrix)
wrap.parent = block.instancedMesh
wrap.visible = true // 默认可见
block.instancedMesh.instanceMatrix.needsUpdate = true
}
dispose() {
for (const block of this.blocks) {
block.dispose()
}
this.blocks.length = 0 // 清空 blocks 数组
this.geometry.dispose() // 释放几何体资源
this.material.dispose() // 释放材质资源
console.log(`InstanceMeshManager ${this.name} disposed.`)
}
}
export class InstanceMeshWrap {
readonly entityId: string
readonly manager: InstanceMeshManager
readonly blockIndex: number
readonly meshIndex: number
uuid: string
parent: THREE.Object3D | null = null
name: string
visible: boolean
constructor(entityId: string, manager: InstanceMeshManager, blockIndex: number, meshIndex: number) {
this.uuid = system.createUUID()
this.entityId = entityId
this.manager = manager
this.meshIndex = meshIndex
this.blockIndex = blockIndex
}
syncMatrix(matrix: THREE.Matrix4): InstanceMeshWrap {
this.manager.setBlockMatrixAt(this, matrix)
return this
}
dispose() {
this.manager.delete(this)
this.parent = null
}
}

9
src/core/manager/InstancePointManager.ts
View File

@ -163,9 +163,16 @@ export default class InstancePointManager {
*/ */
deletePoint(id: string): void { deletePoint(id: string): void {
const wrap = this.__uuidMap.get(id) const wrap = this.__uuidMap.get(id)
if (wrap === undefined) return if (!wrap) {
console.warn(`InstanceMeshManager: Wrap with id ${id} not found`)
return
}
const block = this.blocks[wrap.blockIndex] const block = this.blocks[wrap.blockIndex]
if (!block) {
console.warn(`InstanceMeshManager: Block ${wrap.blockIndex} not found for wrap ${id}`)
return
}
// 隐藏实例 // 隐藏实例
this.dummy.scale.set(0, 0, 0) this.dummy.scale.set(0, 0, 0)

332
src/modules/rack/RackRenderer.ts
View File

@ -1,16 +1,14 @@
import * as THREE from 'three' import * as THREE from 'three'
import { BufferGeometry } from 'three'
import BaseRenderer from '@/core/base/BaseRenderer.ts' 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 { decimalSumBy } from '@/core/ModelUtils'
import Constract from '@/core/Constract.ts' import Constract from '@/core/Constract.ts'
import Plastic_Rough_JPG from '@/assets/Models/Plastic_Rough.jpg' import Plastic_Rough_JPG from '@/assets/Models/Plastic_Rough.jpg'
import {BufferGeometry} from "three"; import storageBar_PNG from '@/assets/Models/storageBar.png'
import storageBar_PNG from "@/assets/Models/storageBar.png"; import { Material } from 'three/src/materials/Material'
import {Material} from "three/src/materials/Material"; import { InstancedMesh } from 'three/src/objects/InstancedMesh'
import {InstancedMesh} from "three/src/objects/InstancedMesh"; //@ts-ignore
import { mergeGeometries } from 'three/addons/utils/BufferGeometryUtils.js'
/** /**
* 货架货位渲染器 * 货架货位渲染器
@ -127,7 +125,7 @@ export default class RackRenderer extends BaseRenderer {
// group.add(lineT as THREE.Object3D) // group.add(lineT as THREE.Object3D)
// } // }
const meshes = this.createRack(item, option); const meshes = this.createRack(item, option)
meshes.forEach(mesh => { meshes.forEach(mesh => {
group.add(mesh) group.add(mesh)
@ -170,52 +168,52 @@ export default class RackRenderer extends BaseRenderer {
bottomLinkHeight = 0.2 bottomLinkHeight = 0.2
barSectionPoints = [ barSectionPoints = [
{x: -0.05, y: -0.05}, { x: -0.05, y: -0.05 },
{x: -0.025, y: -0.05}, { x: -0.025, y: -0.05 },
{x: -0.01, y: -0.045}, { x: -0.01, y: -0.045 },
{x: 0.05, y: -0.045}, { x: 0.05, y: -0.045 },
{x: 0.025, y: -0.05}, { x: 0.025, y: -0.05 },
{x: 0.05, y: -0.05}, { x: 0.05, y: -0.05 },
{x: 0.05, y: 0.042}, { x: 0.05, y: 0.042 },
{x: 0.042, y: 0.05}, { x: 0.042, y: 0.05 },
{x: 0.025, y: 0.05}, { x: 0.025, y: 0.05 },
{x: 0.025, y: 0.042}, { 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.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.042 },
{x: -0.025, y: 0.05}, { x: -0.025, y: 0.05 },
{x: -0.042, y: 0.05}, { x: -0.042, y: 0.05 },
{x: -0.05, y: 0.042}, { x: -0.05, y: 0.042 },
{x: -0.05, y: -0.05} { x: -0.05, y: -0.05 }
] ]
linkSectionPoints = [ linkSectionPoints = [
{x: -0.05, y: -0.05}, { x: -0.05, y: -0.05 },
{x: -0.05, y: 0.05}, { x: -0.05, y: 0.05 },
{x: 0, y: 0.05}, { x: 0, y: 0.05 },
{x: 0, y: 0.06}, { x: 0, y: 0.06 },
{x: -0.06, y: 0.06}, { x: -0.06, y: 0.06 },
{x: -0.06, y: -0.05}, { x: -0.06, y: -0.05 },
{x: -0.05, y: -0.05} { x: -0.05, y: -0.05 }
] ]
linkBarSectionPoints = [ 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}, { 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 { createVerticalBar(x, y, z, length): THREE.BufferGeometry {
// 创建一个形状 柱子的截面形状 // 创建一个形状 柱子的截面形状
const shape = new THREE.Shape(); const shape = new THREE.Shape()
shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y); shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y)
for (let i = 1; i < this.barSectionPoints.length; i++) { for (let i = 1; i < this.barSectionPoints.length; i++) {
shape.lineTo(this.barSectionPoints[i].x , this.barSectionPoints[i].y); shape.lineTo(this.barSectionPoints[i].x, this.barSectionPoints[i].y)
} }
// 拉伸轨迹线 // 拉伸轨迹线
@ -224,18 +222,18 @@ export default class RackRenderer extends BaseRenderer {
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
// 挤出几何图形 参数 // 挤出几何图形 参数
const options = { const options = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: curve, // 设置挤出轨迹 extrudePath: curve // 设置挤出轨迹
}; }
// 创建挤出几何体 // 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options); const geometry = new THREE.ExtrudeGeometry(shape, options)
// 调整uv方便正确贴图 // 调整uv方便正确贴图
this.resetUVs(geometry); this.resetUVs(geometry)
return geometry return geometry
} }
@ -244,29 +242,29 @@ export default class RackRenderer extends BaseRenderer {
let textureLoader = new THREE.TextureLoader() let textureLoader = new THREE.TextureLoader()
// 加载纹理 // 加载纹理
const textureHole = textureLoader.load(storageBar_PNG); // 孔洞 const textureHole = textureLoader.load(storageBar_PNG) // 孔洞
const textureMaterial = textureLoader.load(Plastic_Rough_JPG); // 表面材质 const textureMaterial = textureLoader.load(Plastic_Rough_JPG) // 表面材质
textureHole.repeat.set(10, 18); // X轴重复，Y轴重复 textureHole.repeat.set(10, 18) // X轴重复，Y轴重复
textureMaterial.repeat.set(2, 2); // X轴重复，Y轴重复 textureMaterial.repeat.set(2, 2) // X轴重复，Y轴重复
// textureHole.offset.set(0.5, 0) // textureHole.offset.set(0.5, 0)
// textureHole.center.set(0.5, 0) // textureHole.center.set(0.5, 0)
// 必须设置包裹模式为重复 // 必须设置包裹模式为重复
textureHole.wrapS = THREE.RepeatWrapping; textureHole.wrapS = THREE.RepeatWrapping
textureHole.wrapT = THREE.RepeatWrapping; textureHole.wrapT = THREE.RepeatWrapping
textureMaterial.wrapS = THREE.RepeatWrapping; textureMaterial.wrapS = THREE.RepeatWrapping
textureMaterial.wrapT = THREE.RepeatWrapping; textureMaterial.wrapT = THREE.RepeatWrapping
const material = new THREE.MeshPhongMaterial(); const material = new THREE.MeshPhongMaterial()
material.alphaMap = textureHole; material.alphaMap = textureHole
material.normalMap = textureMaterial; material.normalMap = textureMaterial
material.color.setHex(this.rackVerticalBarColor, "srgb"); material.color.setHex(this.rackVerticalBarColor, 'srgb')
material.specular.setHex(0xff6d6d6d, 'srgb'); material.specular.setHex(0xff6d6d6d, 'srgb')
material.transparent = true; material.transparent = true
material.needsUpdate = true; material.needsUpdate = true
return material; return material
} }
createLinkBar(x, y, z, vBarLength, depth, bottomDistance, topDistance): THREE.BufferGeometry { createLinkBar(x, y, z, vBarLength, depth, bottomDistance, topDistance): THREE.BufferGeometry {
@ -274,10 +272,10 @@ export default class RackRenderer extends BaseRenderer {
const bgs: BufferGeometry[] = [] const bgs: BufferGeometry[] = []
const top = vBarLength - topDistance const top = vBarLength - topDistance
// 创建一个形状 柱子的截面形状 // 创建一个形状 柱子的截面形状
const shape = new THREE.Shape(); const shape = new THREE.Shape()
shape.moveTo(this.linkBarSectionPoints[0].x, this.linkBarSectionPoints[0].y); shape.moveTo(this.linkBarSectionPoints[0].x, this.linkBarSectionPoints[0].y)
for (let i = 1; i < this.linkBarSectionPoints.length; i++) { for (let i = 1; i < this.linkBarSectionPoints.length; i++) {
shape.lineTo(this.linkBarSectionPoints[i].x, this.linkBarSectionPoints[i].y); shape.lineTo(this.linkBarSectionPoints[i].x, this.linkBarSectionPoints[i].y)
} }
// 拉伸轨迹线 横向 底部 // 拉伸轨迹线 横向 底部
@ -286,14 +284,14 @@ export default class RackRenderer extends BaseRenderer {
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
// 挤出几何图形 参数 // 挤出几何图形 参数
const optionsHBottom = { const optionsHBottom = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: curveHBottom, // 设置挤出轨迹 extrudePath: curveHBottom // 设置挤出轨迹
}; }
// 拉伸轨迹线 横向 底部 // 拉伸轨迹线 横向 底部
const curveHTop = new THREE.CatmullRomCurve3( const curveHTop = new THREE.CatmullRomCurve3(
@ -301,99 +299,98 @@ export default class RackRenderer extends BaseRenderer {
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
// 挤出几何图形 参数 // 挤出几何图形 参数
const optionsHTop = { const optionsHTop = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: curveHTop, // 设置挤出轨迹 extrudePath: curveHTop // 设置挤出轨迹
}; }
// 创建挤出几何体 // 创建挤出几何体
const geometryHBottom = new THREE.ExtrudeGeometry(shape, optionsHBottom); const geometryHBottom = new THREE.ExtrudeGeometry(shape, optionsHBottom)
const geometryHTop = new THREE.ExtrudeGeometry(shape, optionsHTop); const geometryHTop = new THREE.ExtrudeGeometry(shape, optionsHTop)
bgs.push(geometryHBottom, geometryHTop) bgs.push(geometryHBottom, geometryHTop)
let remainingHeight = vBarLength - bottomDistance - topDistance let remainingHeight = vBarLength - bottomDistance - topDistance
// 需要创建斜杆 // 需要创建斜杆
for (let i = 0; i < Math.floor(remainingHeight / depth); i++) { for (let i = 0; i < Math.floor(remainingHeight / depth); i++) {
// 拉伸轨迹线 斜向 // 拉伸轨迹线 斜向
const curveD = new THREE.CatmullRomCurve3( 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)] (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)], : [new THREE.Vector3(0, bottomDistance + depth * (i + 1), 0), new THREE.Vector3(0, bottomDistance + depth * (i), depth)],
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
const optionsD = { const optionsD = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: curveD, // 设置挤出轨迹 extrudePath: curveD // 设置挤出轨迹
}; }
const geometryD = new THREE.ExtrudeGeometry(shape, optionsD); const geometryD = new THREE.ExtrudeGeometry(shape, optionsD)
bgs.push(geometryD) bgs.push(geometryD)
} }
if (vBarLength - bottomDistance - topDistance > depth) { if (vBarLength - bottomDistance - topDistance > depth) {
} }
// 调整uv方便正确贴图 // 调整uv方便正确贴图
// this.resetUVs(geometry); // this.resetUVs(geometry);
return BufferGeometryUtils.mergeGeometries(bgs) return mergeGeometries(bgs)
} }
createLinkBarMaterial(): THREE.Material { createLinkBarMaterial(): THREE.Material {
const material = new THREE.MeshPhongMaterial(); const material = new THREE.MeshPhongMaterial()
material.color.setHex(this.rackLinkBarColor, "srgb"); material.color.setHex(this.rackLinkBarColor, 'srgb')
material.specular.setHex(0xff6d6d6d, 'srgb'); material.specular.setHex(0xff6d6d6d, 'srgb')
material.transparent = true; material.transparent = true
material.needsUpdate = true; material.needsUpdate = true
return material; return material
} }
createHorizontalBar(x, y, z, length): THREE.BufferGeometry { createHorizontalBar(x, y, z, length): THREE.BufferGeometry {
// 创建一个形状 柱子的截面形状 // 创建一个形状 柱子的截面形状
const shape = new THREE.Shape(); const shape = new THREE.Shape()
shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y); shape.moveTo(this.barSectionPoints[0].x, this.barSectionPoints[0].y)
for (let i = 1; i < this.barSectionPoints.length; i++) { for (let i = 1; i < this.barSectionPoints.length; i++) {
shape.lineTo(this.barSectionPoints[i].x , this.barSectionPoints[i].y); shape.lineTo(this.barSectionPoints[i].x, this.barSectionPoints[i].y)
} }
// 拉伸轨迹线 // 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3( const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0.05, 0, 0), new THREE.Vector3(length -0.05, 0, 0)], [new THREE.Vector3(0.05, 0, 0), new THREE.Vector3(length - 0.05, 0, 0)],
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
// 挤出几何图形 参数 // 挤出几何图形 参数
const options = { const options = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: curve, // 设置挤出轨迹 extrudePath: curve // 设置挤出轨迹
}; }
// 创建挤出几何体 // 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options); const geometry = new THREE.ExtrudeGeometry(shape, options)
const linkShapeL = new THREE.Shape(); const linkShapeL = new THREE.Shape()
const linkShapeR = new THREE.Shape(); const linkShapeR = new THREE.Shape()
linkShapeL.moveTo(this.linkSectionPoints[0].x, this.linkSectionPoints[0].y); linkShapeL.moveTo(this.linkSectionPoints[0].x, this.linkSectionPoints[0].y)
linkShapeR.moveTo(this.linkSectionPoints[0].x + (length), this.linkSectionPoints[0].y); linkShapeR.moveTo(this.linkSectionPoints[0].x + (length), this.linkSectionPoints[0].y)
for (let i = 1; i < this.linkSectionPoints.length; i++) { for (let i = 1; i < this.linkSectionPoints.length; i++) {
linkShapeL.lineTo(this.linkSectionPoints[i].x , this.linkSectionPoints[i].y); linkShapeL.lineTo(this.linkSectionPoints[i].x, this.linkSectionPoints[i].y)
linkShapeR.lineTo(this.linkSectionPoints[i].x + (length), this.linkSectionPoints[i].y); linkShapeR.lineTo(this.linkSectionPoints[i].x + (length), this.linkSectionPoints[i].y)
} }
// 拉伸轨迹线 // 拉伸轨迹线
@ -402,36 +399,35 @@ export default class RackRenderer extends BaseRenderer {
false, // 闭合曲线 false, // 闭合曲线
'catmullrom', 'catmullrom',
0 0
); )
// 挤出几何图形 参数 // 挤出几何图形 参数
const linkOptions = { const linkOptions = {
steps: 1, steps: 1,
bevelEnabled: false, bevelEnabled: false,
extrudePath: linkCurve, // 设置挤出轨迹 extrudePath: linkCurve // 设置挤出轨迹
}; }
// 创建挤出几何体 // 创建挤出几何体
const linkGeometryL = new THREE.ExtrudeGeometry(linkShapeL, linkOptions); const linkGeometryL = new THREE.ExtrudeGeometry(linkShapeL, linkOptions)
linkGeometryL.rotateZ(-Math.PI / 2) linkGeometryL.rotateZ(-Math.PI / 2)
const linkGeometryR = new THREE.ExtrudeGeometry(linkShapeR, linkOptions); const linkGeometryR = new THREE.ExtrudeGeometry(linkShapeR, linkOptions)
linkGeometryR.rotateX(-Math.PI) linkGeometryR.rotateX(-Math.PI)
linkGeometryR.rotateZ(-Math.PI / 2) linkGeometryR.rotateZ(-Math.PI / 2)
// 调整uv方便正确贴图 // 调整uv方便正确贴图
// this.resetUVs(geometry); // this.resetUVs(geometry);
return BufferGeometryUtils.mergeGeometries([geometry, linkGeometryL, linkGeometryR]) return mergeGeometries([geometry, linkGeometryL, linkGeometryR])
} }
createHorizontalBarMaterial(): THREE.Material { createHorizontalBarMaterial(): THREE.Material {
const material = new THREE.MeshPhongMaterial(); const material = new THREE.MeshPhongMaterial()
material.color.setHex(this.rackHorizontalBarColor, "srgb"); material.color.setHex(this.rackHorizontalBarColor, 'srgb')
material.specular.setHex(0xff6d6d6d, 'srgb'); material.specular.setHex(0xff6d6d6d, 'srgb')
material.transparent = true; material.transparent = true
material.needsUpdate = true; material.needsUpdate = true
return material; return material
} }
createRack(item: ItemJson, option?: RendererCudOption): InstancedMesh[] { createRack(item: ItemJson, option?: RendererCudOption): InstancedMesh[] {
@ -455,12 +451,12 @@ export default class RackRenderer extends BaseRenderer {
const rackHeight = _.max(heights) const rackHeight = _.max(heights)
// 计算立住坐标点和长度 // 计算立住坐标点和长度
const vBarMatrix: {x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number}[] = []; 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}[] = []; 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; let distanceX = 0, distanceY = 0
for (let i = -1; i < item.dt.bays.length; i++) { for (let i = -1; i < item.dt.bays.length; i++) {
if (i >= 0) { if (i >= 0) {
@ -475,7 +471,7 @@ export default class RackRenderer extends BaseRenderer {
sy: 1, sy: 1,
sz: 1, sz: 1,
rx: 0, rx: 0,
ry: Math.PI/2, ry: Math.PI / 2,
rz: 0, rz: 0,
l: rackHeight l: rackHeight
}) })
@ -487,29 +483,29 @@ export default class RackRenderer extends BaseRenderer {
sy: 1, sy: 1,
sz: 1, sz: 1,
rx: 0, rx: 0,
ry: -Math.PI/2, ry: -Math.PI / 2,
rz: 0, rz: 0,
l: rackHeight l: rackHeight
}) })
linkBarMatrix.push({ linkBarMatrix.push({
x: rackPoint.x + distanceX, x: rackPoint.x + distanceX,
y: rackPoint.y, y: rackPoint.y,
z: i%2 == 0 ? (rackPoint.z + item.dt.rackDepth) : rackPoint.z, z: i % 2 == 0 ? (rackPoint.z + item.dt.rackDepth) : rackPoint.z,
sx: 1, sx: 1,
sy: 1, sy: 1,
sz: 1, sz: 1,
rx: 0, rx: 0,
ry: i%2 == 0 ? Math.PI : 0, ry: i % 2 == 0 ? Math.PI : 0,
rz: 0, rz: 0,
l: rackHeight l: rackHeight
}) })
} }
// 计算横梁数量 // 计算横梁数量
const hBarMatrix: {x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number}[] = []; const hBarMatrix: { x: number, y: number, z: number, sx: number, sy: number, sz: number, rx: number, ry: number, rz: number, l: number }[] = []
distanceX = 0; distanceX = 0
for (let i = 0; i < item.dt.bays.length; i++) { for (let i = 0; i < item.dt.bays.length; i++) {
distanceY = this.bottomBarHeight; distanceY = this.bottomBarHeight
const bay = item.dt.bays[i] const bay = item.dt.bays[i]
for (let j = 0; j < bay.levelHeight.length; j++) { for (let j = 0; j < bay.levelHeight.length; j++) {
const levelHeight = bay.levelHeight[j] const levelHeight = bay.levelHeight[j]
@ -523,7 +519,7 @@ export default class RackRenderer extends BaseRenderer {
sx: 1, sx: 1,
sy: 0.8, sy: 0.8,
sz: 1, sz: 1,
rx: Math.PI/2, rx: Math.PI / 2,
ry: 0, ry: 0,
rz: 0, rz: 0,
l: bay.bayWidth l: bay.bayWidth
@ -535,7 +531,7 @@ export default class RackRenderer extends BaseRenderer {
sx: 1, sx: 1,
sy: 0.8, sy: 0.8,
sz: 1, sz: 1,
rx: -Math.PI/2, rx: -Math.PI / 2,
ry: 0, ry: 0,
rz: 0, rz: 0,
l: bay.bayWidth l: bay.bayWidth
@ -545,7 +541,7 @@ export default class RackRenderer extends BaseRenderer {
distanceX += bay.bayWidth distanceX += bay.bayWidth
} }
const meshes: InstancedMesh[] = []; const meshes: InstancedMesh[] = []
if (vBarMatrix.length > 0) { if (vBarMatrix.length > 0) {
if (!this.rackVerticalBarGeometry) { if (!this.rackVerticalBarGeometry) {
@ -554,15 +550,15 @@ export default class RackRenderer extends BaseRenderer {
if (!this.rackVerticalBarMaterial) { if (!this.rackVerticalBarMaterial) {
this.rackVerticalBarMaterial = this.createVerticalBarMaterial() this.rackVerticalBarMaterial = this.createVerticalBarMaterial()
} }
const dummy = new THREE.Object3D(); const dummy = new THREE.Object3D()
const vBarMesh = new THREE.InstancedMesh(this.rackVerticalBarGeometry, this.rackVerticalBarMaterial, vBarMatrix.length); const vBarMesh = new THREE.InstancedMesh(this.rackVerticalBarGeometry, this.rackVerticalBarMaterial, vBarMatrix.length)
for (let i = 0; i < vBarMatrix.length; i++) { for (let i = 0; i < vBarMatrix.length; i++) {
const vp = vBarMatrix[i] const vp = vBarMatrix[i]
dummy.position.set(vp.x, vp.y, vp.z); dummy.position.set(vp.x, vp.y, vp.z)
dummy.rotation.set(vp.rx, vp.ry, vp.rz); dummy.rotation.set(vp.rx, vp.ry, vp.rz)
dummy.scale.set(vp.sx, vp.sy, vp.sz); dummy.scale.set(vp.sx, vp.sy, vp.sz)
dummy.updateMatrix(); dummy.updateMatrix()
vBarMesh.setMatrixAt(i, dummy.matrix); vBarMesh.setMatrixAt(i, dummy.matrix)
} }
meshes.push(vBarMesh) meshes.push(vBarMesh)
} }
@ -574,15 +570,15 @@ export default class RackRenderer extends BaseRenderer {
if (!this.rackLinkBarMaterial) { if (!this.rackLinkBarMaterial) {
this.rackLinkBarMaterial = this.createLinkBarMaterial() this.rackLinkBarMaterial = this.createLinkBarMaterial()
} }
const dummy = new THREE.Object3D(); const dummy = new THREE.Object3D()
const linkBarMesh = new THREE.InstancedMesh(this.rackLinkBarGeometry, this.rackLinkBarMaterial, linkBarMatrix.length); const linkBarMesh = new THREE.InstancedMesh(this.rackLinkBarGeometry, this.rackLinkBarMaterial, linkBarMatrix.length)
for (let i = 0; i < linkBarMatrix.length; i++) { for (let i = 0; i < linkBarMatrix.length; i++) {
const lp = linkBarMatrix[i] const lp = linkBarMatrix[i]
dummy.position.set(lp.x, lp.y, lp.z); dummy.position.set(lp.x, lp.y, lp.z)
dummy.rotation.set(lp.rx, lp.ry, lp.rz); dummy.rotation.set(lp.rx, lp.ry, lp.rz)
dummy.scale.set(lp.sx, lp.sy, lp.sz); dummy.scale.set(lp.sx, lp.sy, lp.sz)
dummy.updateMatrix(); dummy.updateMatrix()
linkBarMesh.setMatrixAt(i, dummy.matrix); linkBarMesh.setMatrixAt(i, dummy.matrix)
} }
meshes.push(linkBarMesh) meshes.push(linkBarMesh)
} }
@ -594,51 +590,51 @@ export default class RackRenderer extends BaseRenderer {
if (!this.rackHorizontalBarMaterial) { if (!this.rackHorizontalBarMaterial) {
this.rackHorizontalBarMaterial = this.createHorizontalBarMaterial() this.rackHorizontalBarMaterial = this.createHorizontalBarMaterial()
} }
const dummy = new THREE.Object3D(); const dummy = new THREE.Object3D()
const hBarMesh = new THREE.InstancedMesh(this.rackHorizontalBarGeometry, this.rackHorizontalBarMaterial, hBarMatrix.length); const hBarMesh = new THREE.InstancedMesh(this.rackHorizontalBarGeometry, this.rackHorizontalBarMaterial, hBarMatrix.length)
for (let i = 0; i < hBarMatrix.length; i++) { for (let i = 0; i < hBarMatrix.length; i++) {
const hp = hBarMatrix[i] const hp = hBarMatrix[i]
dummy.position.set(hp.x, hp.y, hp.z); dummy.position.set(hp.x, hp.y, hp.z)
dummy.rotation.set(hp.rx, hp.ry, hp.rz); dummy.rotation.set(hp.rx, hp.ry, hp.rz)
dummy.scale.set(hp.sx, hp.sy, hp.sz); dummy.scale.set(hp.sx, hp.sy, hp.sz)
dummy.updateMatrix(); dummy.updateMatrix()
hBarMesh.setMatrixAt(i, dummy.matrix); hBarMesh.setMatrixAt(i, dummy.matrix)
} }
meshes.push(hBarMesh) meshes.push(hBarMesh)
} }
return meshes; return meshes
} }
resetUVs(geometry) { resetUVs(geometry: THREE.ExtrudeGeometry) {
if (geometry == undefined) return; if (geometry == undefined) return
const pos = geometry.getAttribute("position"), const pos = geometry.getAttribute('position'),
nor = geometry.getAttribute("normal"), nor = geometry.getAttribute('normal'),
uvs = geometry.getAttribute("uv"); uvs = geometry.getAttribute('uv')
for (let i = 0; i < pos.count; i++) { for (let i = 0; i < pos.count; i++) {
let x = 0, y = 0; let x = 0, y = 0
const nx = Math.abs(nor.getX(i)), ny = Math.abs(nor.getY(i)), nz = Math.abs(nor.getZ(i)); const nx = Math.abs(nor.getX(i)), ny = Math.abs(nor.getY(i)), nz = Math.abs(nor.getZ(i))
// if facing X // if facing X
if (nx >= ny && nx >= nz) { if (nx >= ny && nx >= nz) {
x = pos.getZ(i); x = pos.getZ(i)
y = pos.getY(i); y = pos.getY(i)
} }
// if facing Y // if facing Y
if (ny >= nx && ny >= nz) { if (ny >= nx && ny >= nz) {
x = pos.getX(i); x = pos.getX(i)
y = pos.getZ(i); y = pos.getZ(i)
} }
// if facing Z // if facing Z
if (nz >= nx && nz >= ny) { if (nz >= nx && nz >= ny) {
x = pos.getX(i); x = pos.getX(i)
y = pos.getY(i); y = pos.getY(i)
} }
uvs.setXY(i, x, y); uvs.setXY(i, x, y)
} }
} }

Write Preview
Loading…
Cancel
Save