diff --git a/src/designer/model3DView/Model3DView.vue b/src/designer/model3DView/Model3DView.vue index a9fa332..e5b7ecf 100644 --- a/src/designer/model3DView/Model3DView.vue +++ b/src/designer/model3DView/Model3DView.vue @@ -16,6 +16,7 @@ 打开材质 添加输送线 + 添加货架
材质颜色 @@ -85,10 +86,9 @@ import Split from '@/components/split/split.vue' import SplitArea from '@/components/split/split-area.vue' import { renderIcon } from '@/utils/webutils.js' import textureUrl from '@/assets/images/conveyor/shapes/RibSideSkirtThumbnail.jpg' -import textureUrl2 from '@/assets/images/conveyor/shapes/logo.png' import moveUrl from '@/assets/images/conveyor/shapes/move.svg' import arrowRightUrl from '@/assets/images/conveyor/shapes/arrow-right.svg' -// import pointImg from '@/assets/images/logo.png' arrow-right.svg +import rackUrl from '@/assets/images/conveyor/shapes/Rack.png' // DOM refs const canvasContainer = ref(null) @@ -260,6 +260,125 @@ function addMarkerAt(x, y,z,textUrl, scale = 1) { }); } +function createShelf(){//创建货架 + const textureLoader = new THREE.TextureLoader(); + const metalTexture = textureLoader.load('path/to/your/metal/texture.jpg'); // 替换为实际路径 + + // 材质设置 + const material = new THREE.MeshStandardMaterial({ + map: metalTexture, + metalness: 1.0, + roughness: 0.5 + }); + + // 货架参数 + const shelfLength = 10; // 总长 + const shelfWidth = 0.8; // 宽度(深度) + const shelfThickness = 0.1; // 层板厚度 + const rows = 3; // 层数 + const columns = 4; // 列数 + const spacingY = 1; // 层间距 + + const unitLength = shelfLength / columns; // 每个格子长度:2.5m + + // ✅ 整体上浮高度:让模型位于水平面之上 + const baseHeight = 2; // 单位:米 + + // --------------------- + // 创建层板(3层 × 4列) + // --------------------- + for (let row = 0; row < rows; row++) { + for (let col = 0; col < columns; col++) { + const geometry = new THREE.BoxGeometry(unitLength, shelfThickness, shelfWidth); + const mesh = new THREE.Mesh(geometry, material); + + const x = -shelfLength / 2 + unitLength * col + unitLength / 2; + const y = -(shelfThickness + spacingY) * row - shelfThickness / 2 + baseHeight; // 加上偏移 + const z = 0; + + mesh.position.set(x, y, z); + scene.add(mesh); + } + } + + // --------------------- + // 计算第三层层板底部位置(用于支撑柱对齐) + // --------------------- + const thirdShelfCenterY = -(shelfThickness + spacingY) * 2 - shelfThickness / 2 + baseHeight; + const thirdShelfBottomY = thirdShelfCenterY - shelfThickness / 2; + + // --------------------- +// 创建支撑柱 + 添加贴纸 +// --------------------- + + const postWidth = 0.1; + const postDepth = 0.1; + const postHeight = 3.3; + + + + + const postPositionsX = [0, 2.5, 5, 7.5, 10]; + const postPositionsZ = [-shelfWidth / 2, shelfWidth / 2]; + +// 加载贴纸纹理(可以是透明PNG) + const loader = new THREE.TextureLoader(); + loader.load(rackUrl, (texture) => { + // 创建贴纸材质(支持透明) + const stickerMaterial = new THREE.MeshBasicMaterial({ + map: texture, + transparent: true, + side: THREE.DoubleSide // 双面可见 + }); + + postPositionsX.forEach(x => { + postPositionsZ.forEach(z => { + // 创建柱子 + const postGeometry = new THREE.BoxGeometry(postWidth, postHeight, postDepth); + const post = new THREE.Mesh(postGeometry, material); + + // 设置柱子中心 Y 坐标,使其底部对齐第三层层板底部 + const postCenterY = thirdShelfBottomY + postHeight / 2; + + post.position.set( + x - shelfLength / 2, + postCenterY, + z + ); + + scene.add(post); + + // --------------------- + // 创建贴纸(附加在外侧面上) + // --------------------- + const stickerWidth = 0.08; // 贴纸宽度 + const stickerHeight = 0.2; // 贴纸高度 + + const stickerGeometry = new THREE.PlaneGeometry(stickerWidth, stickerHeight); + const sticker = new THREE.Mesh(stickerGeometry, stickerMaterial); + + // 将贴纸放在柱子外侧表面中间位置 + sticker.position.set( + post.position.x + postWidth / 2, // 柱子外侧 + post.position.y, // Y 中心 + post.position.z // Z 对齐 + ); + + // 让贴纸始终面向相机(可选) + // 使用 dcm.orientation.lookAt(camera.position) 或手动设置朝向 + // 这里简单设置固定朝向正面(可根据需求扩展为自动朝向相机) + sticker.lookAt(new THREE.Vector3(1, 0, 0)); // 面向 X 正方向 + + // 微调:让贴纸略微浮出柱子表面,避免深度冲突 + sticker.position.x += 0.01; + + scene.add(sticker); + }); + }); + }) +} + + function initThree() { const viewerDom = canvasContainer.value diff --git a/src/designer/viewWidgets/toolbox/ToolboxView.vue b/src/designer/viewWidgets/toolbox/ToolboxView.vue index 275c701..10c372d 100644 --- a/src/designer/viewWidgets/toolbox/ToolboxView.vue +++ b/src/designer/viewWidgets/toolbox/ToolboxView.vue @@ -102,8 +102,8 @@ export default { { name: 'other', icon: 'antd CiOutlined', label: '辅助', children: [ - { name: 'source', label: '发生器' }, - { name: 'sink', label: '消失器' }, + { name: 'source', icon:'antd SoundOutlined',label: '发生器' }, + { name: 'sink',icon:'fa Eraser', label: '消失器' }, { name: 'dispatcher', label: '任务分配器' }, { name: 'text', label: '文本' }, { name: 'image', label: '图片' },