!1756 增强：世界坐标XY正轴添加网格助手

src/Editor/TranstrolControl/CoorAxes.ts

@@ -1,6 +1,7 @@
-import { Group } from 'three';
+import { Color, Group } from 'three';
 import { ColorMaterial } from '../../Common/ColorPalette';
 import { Axes } from './Axes';
+import GridHelper2 from './GridHelper2';
 import { IGizmo } from './IGizmo';
 
 export enum AxisType
@@ -43,6 +44,17 @@ export class CoorAxes extends Group implements IGizmo
         this._Axis_Z.userData.Axis = AxisType.Z;
 
         this.add(this._Axis_X, this._Axis_Y, this._Axis_Z);
+
+    }
+
+    //添加网格助手
+    InitGripHelper()
+    {
+        const gridHelper = new GridHelper2(2, 3, new Color(0xfffffff), new Color(0x444444));
+        gridHelper.position.set(0, 0, 0);
+        gridHelper.rotateX(Math.PI / -2);
+        gridHelper.updateMatrix();
+        this.add(gridHelper);
     }
 
     set AxtiveIndex(t) { };

src/Editor/TranstrolControl/GridHelper2.ts

@@ -0,0 +1,52 @@
+import { BufferGeometry, Color, Group, Line, LineBasicMaterial, Vector3 } from "three";
+
+export default class GridHelper2 extends Group
+{
+    /**
+     *
+     * @param size  网格大小
+     * @param divisions 网格内一行/列有几个格子
+     * @param color1 //外边框颜色
+     * @param color2 //内线颜色
+     */
+    constructor(size: number, divisions: number, color1: Color, color2: Color)
+    {
+        super();
+        const material1 = new LineBasicMaterial({
+            color: color1,
+        });
+        const material2 = new LineBasicMaterial({
+            color: color2,
+        });
+
+        const points = [];
+        points.push(new Vector3(0, 0, 0));
+        points.push(new Vector3(0, 0, size));
+        points.push(new Vector3(size, 0, size));
+        points.push(new Vector3(size, 0, 0));
+        points.push(new Vector3(0, 0, 0));
+
+        const geometry = new BufferGeometry().setFromPoints(points);
+
+        const line = new Line(geometry, material1);
+        line.updateMatrix();
+        this.add(line);
+
+        const divisionsDistance = size / divisions;
+        const row = [new Vector3(0, 0, 0), new Vector3(size, 0, 0)];
+        const column = [new Vector3(0, 0, 0), new Vector3(0, 0, size)];
+
+        const centerNum = divisions / 2;
+        for (let i = 1; i < divisions; i++)
+        {
+            const innerLineRow = new Line(new BufferGeometry().setFromPoints(row), i === centerNum ? material1 : material2);
+            innerLineRow.position.set(line.position.x, line.position.y, line.position.z + divisionsDistance * i);
+            innerLineRow.updateMatrix();
+            this.add(innerLineRow);
+            const innerLineColumn = new Line(new BufferGeometry().setFromPoints(column), i === centerNum ? material1 : material2);
+            innerLineColumn.position.set(line.position.x + divisionsDistance * i, line.position.y, line.position.z);
+            innerLineColumn.updateMatrix();
+            this.add(innerLineColumn);
+        }
+    }
+}

src/Editor/UCSServices.ts

@@ -13,8 +13,8 @@ export enum UCSPsotion
 //在Editor下的一个服务,提供了UCS轴的显示.
 export class UCSServices
 {
-    private _UCSMatrix: Matrix4 = new Matrix4();
-    private _UcsObj: CoorAxes = new CoorAxes();
+    private _UCSMatrix = new Matrix4();
+    private _UcsObj = new CoorAxes();
     private _DisplayPosition = UCSPsotion.Origin;
     constructor(private _Editor: Editor)
     {
@@ -22,6 +22,7 @@ export class UCSServices
         let preView = view.PreViewer;
 
         //在前视图绘制ucs轴.
+        this._UcsObj.InitGripHelper();
         this._UcsObj.scale.set(50, 50, 50);
         preView.Scene.add(this._UcsObj);