diff --git a/src/components/Model3DView.vue b/src/components/Model3DView.vue
index e5b7ecf..110e9db 100644
--- a/src/components/Model3DView.vue
+++ b/src/components/Model3DView.vue
@@ -17,6 +17,7 @@
添加输送线
添加货架
+ 添加地堆
材质颜色
@@ -378,6 +379,15 @@ function createShelf(){//创建货架
})
}
+function createGroundStore() {
+ const planeGeometry = new THREE.PlaneGeometry(1, 1);
+ const material = new THREE.MeshBasicMaterial({
+ color: 0x00ff00,
+ side: THREE.DoubleSide // 双面渲染:ml-citation{ref="5,8" data="citationList"}
+ });
+ const planeMesh = new THREE.Mesh(planeGeometry, material);
+ scene.add(planeMesh);
+}
function initThree() {
const viewerDom = canvasContainer.value
diff --git a/src/modules/gstore/GstoreRenderer.ts b/src/modules/gstore/GstoreRenderer.ts
index 789b311..96fcc95 100644
--- a/src/modules/gstore/GstoreRenderer.ts
+++ b/src/modules/gstore/GstoreRenderer.ts
@@ -1,15 +1,14 @@
import * as THREE from 'three'
import BaseRenderer from '@/core/base/BaseRenderer.ts'
-import { Text } from 'troika-three-text'
-import MoveLinePointPng from '@/assets/images/moveline_point.png'
-import SimSunTTF from '@/assets/fonts/simsunb.ttf'
-import { getLineId } from '@/core/ModelUtils.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'
/**
- * 辅助测量工具渲染器
+ * 地堆货位渲染器
*/
export default class GstoreRenderer extends BaseRenderer {
- static POINT_NAME = 'way_point'
+ static POINT_NAME = 'ground_store'
pointMaterial: THREE.Material
@@ -19,6 +18,7 @@ export default class GstoreRenderer extends BaseRenderer {
readonly defulePositionY: number = 0.5 // 默认点的高度, 0.01, 防止和地面重合
readonly defaultScale: THREE.Vector3 = new THREE.Vector3(1.5, 1.2, 0.1)
readonly defaultRotation: THREE.Vector3 = new THREE.Vector3(0, 0, 0)
+ readonly defaultLineWidth: number = 0.05
constructor(itemTypeName: string) {
super(itemTypeName)
@@ -50,13 +50,56 @@ export default class GstoreRenderer extends BaseRenderer {
}
createPointBasic(item: ItemJson, option?: RendererCudOption): THREE.Object3D[] {
- const obj = new THREE.Sprite(this.pointMaterial as THREE.SpriteMaterial)
- obj.name = GstoreRenderer.POINT_NAME
- return [obj]
+ // 创建平面几何体
+
+ const group = new THREE.Group()
+ group.name = GstoreRenderer.POINT_NAME
+
+ // 绘制背景矩形框
+ const planeGeometry = new THREE.PlaneGeometry(item.dt.storeWidth, item.dt.storeDepth);
+ planeGeometry.rotateX(-Math.PI / 2)
+ const planeMaterial = new THREE.MeshBasicMaterial({
+ color: 'white',
+ transparent: true, // 启用透明
+ opacity: 0.2, // 50%透明度
+ depthWrite: false, // 防止深度冲突
+ side: THREE.DoubleSide // 双面渲染:ml-citation{ref="5,8" data="citationList"}
+ });
+ const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial);
+ group.add(planeMesh)
+
+ if (!item.dt.storeWidth || !item.dt.storeDepth) {
+ return [group]
+ }
+
+ // 绘制边框
+ const lineXLen = item.dt.storeWidth - this.defaultLineWidth
+ const lineYLen = item.dt.storeDepth - this.defaultLineWidth
+
+ const lineGeometry = new LineGeometry().setPositions([
+ -(lineXLen/2),-(lineYLen/2),0,
+ lineXLen/2,-(lineYLen/2),0,
+ lineXLen/2,lineYLen/2,0,
+ -(lineXLen/2),lineYLen/2,0,
+ -(lineXLen/2),-(lineYLen/2),0
+ ]);
+ lineGeometry.rotateX(-Math.PI / 2)
+ const lineMaterial = new LineMaterial({
+ color: 0x00ff00,
+ linewidth: 0.05,
+ worldUnits: true,
+ resolution: new THREE.Vector2(window.innerWidth, window.innerHeight),
+ side: THREE.DoubleSide
+ });
+ //
+ const line = new Line2(lineGeometry, lineMaterial);
+ group.add(line as THREE.Object3D)
+
+ return [group]
}
dispose() {
super.dispose()
this.pointMaterial.dispose()
}
-}
\ No newline at end of file
+}