Browse Source

对齐支持

haojianlong 5 years ago
parent
commit
8bbf5ce5b5

+ 0 - 2
saga-web-big/src/index.ts

@@ -32,7 +32,6 @@ import { STextMarkerItem } from "./items/topology/STextMarkerItem";
 export {
     SCompassItem,
     SCurveRelation,
-    SEntityItem,
     SFloorItem,
     SLayerItem,
     SLineRelation,
@@ -54,7 +53,6 @@ export {
     SIconTextItem,
     SRelationState,
     SItemStatus,
-    SMarkerItem,
     SNoneLegendItem,
     SLineLegendItem,
     SZoneLegendItem,

+ 197 - 12
saga-web-graph/src/SGraphSelectContainer.ts

@@ -99,13 +99,13 @@ export class SGraphSelectContainer extends SObject {
             case SGraphLayoutType.Bottom:
                 this.alignBottom();
                 break;
-            case SGraphLayoutType.center:
+            case SGraphLayoutType.Center:
                 this.alignCenter();
                 break;
             case SGraphLayoutType.Horizontal:
                 this.alignHorizontal();
                 break;
-            case SGraphLayoutType.middle:
+            case SGraphLayoutType.Middle:
                 this.alignMiddle();
                 break;
             case SGraphLayoutType.Right:
@@ -127,47 +127,232 @@ export class SGraphSelectContainer extends SObject {
      * 左对齐
      *
      * */
-    private alignLeft(): void {} // Function alignLeft()
+    private alignLeft(): void {
+        let standardItem = this.itemList[0];
+        // 计算第一个外接矩阵左上角坐标在场景中的坐标
+        let p = standardItem.mapToScene(
+            standardItem.boundingRect().x,
+            standardItem.boundingRect().y
+        );
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                // 将p转换为当前item中的坐标
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                // 根据等式差值相等 newboundx - oldboundx = newposx - oldposx => newposx = newboundx - oldboundx + oldposx
+                curItem.x = p1.x - curItem.boundingRect().x + curItem.x;
+            }
+        }
+    } // Function alignLeft()
 
     /**
      * 顶对齐
      *
      * */
-    private alignTop(): void {} // Function alignTop()
+    private alignTop(): void {
+        let standardItem = this.itemList[0];
+        let p = standardItem.mapToScene(
+            standardItem.boundingRect().x,
+            standardItem.boundingRect().y
+        );
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                curItem.y = p1.y - curItem.boundingRect().y + curItem.y;
+            }
+        }
+    } // Function alignTop()
 
     /**
      * 右对齐
      *
      * */
-    private alignRight(): void {} // Function alignRight()
+    private alignRight(): void {
+        let standardItem = this.itemList[0];
+        let p = standardItem.mapToScene(
+            standardItem.boundingRect().right,
+            standardItem.boundingRect().bottom
+        );
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                curItem.x = p1.x - curItem.boundingRect().right + curItem.x;
+            }
+        }
+    } // Function alignRight()
 
     /**
      * 底对齐
      *
      * */
-    private alignBottom(): void {} // Function alignBottom()
+    private alignBottom(): void {
+        let standardItem = this.itemList[0];
+        let p = standardItem.mapToScene(
+            standardItem.boundingRect().right,
+            standardItem.boundingRect().bottom
+        );
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                curItem.y = p1.y - curItem.boundingRect().bottom + curItem.y;
+            }
+        }
+    } // Function alignBottom()
 
     /**
      * 水平居中对齐
      *
      * */
-    private alignCenter(): void {} // Function alignCenter()
+    private alignCenter(): void {
+        // 第一个选中的item即为基准对象
+        let standardItem = this.itemList[0];
+        // 基准对象的中心点
+        let center = standardItem.boundingRect().center();
+        // 中心点转换为场景坐标
+        let p = standardItem.mapToScene(center.x, center.y);
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                // 根据等式差值相等 newcenterx - oldcenterx = newposx - oldposx => newposx = newcenterx - oldcenterx + oldposx
+                curItem.x =
+                    p1.x - curItem.boundingRect().center().x + curItem.x;
+            }
+        }
+    } // Function alignCenter()
 
     /**
      * 垂直居中对齐
      *
      * */
-    private alignMiddle(): void {} // Function alignMiddle()
+    private alignMiddle(): void {
+        // 第一个选中的item即为基准对象
+        let standardItem = this.itemList[0];
+        // 基准对象的中心点
+        let center = standardItem.boundingRect().center();
+        // 中心点转换为场景坐标
+        let p = standardItem.mapToScene(center.x, center.y);
+        for (let i = 1; i < this.itemList.length; i++) {
+            let curItem = this.itemList[i];
+            if (curItem.moveable) {
+                let p1 = curItem.mapFromScene(p.x, p.y);
+                curItem.y =
+                    p1.y - curItem.boundingRect().center().y + curItem.y;
+            }
+        }
+    } // Function alignMiddle()
 
     /**
-     * 水平分散
+     * 垂直分布
      *
      * */
-    private alignVertical(): void {} // Function alignVertical()
+    private alignVertical(): void {
+        if (this.itemList.length < 3) {
+            return;
+        }
+        for (let i = 0; i < this.itemList.length - 1; i++) {
+            for (let j = 0; j < this.itemList.length - 1 - i; j++) {
+                let curItemCenter = this.itemList[j].boundingRect().center();
+                let nextItemCenter = this.itemList[j + 1]
+                    .boundingRect()
+                    .center();
+                let curCenterY = this.itemList[j].mapToScene(
+                    curItemCenter.x,
+                    curItemCenter.y
+                ).y;
+                let nextCenterY = this.itemList[j + 1].mapToScene(
+                    nextItemCenter.x,
+                    nextItemCenter.y
+                ).y;
+                if (curCenterY > nextCenterY) {
+                    let temp = this.itemList[j];
+                    this.itemList[j] = this.itemList[j + 1];
+                    this.itemList[j + 1] = temp;
+                }
+            }
+        }
+
+        let top = this.itemList[0];
+        let bottom = this.itemList[this.itemList.length - 1];
+
+        let topCenter = top.boundingRect().center();
+        let bottomCenter = bottom.boundingRect().center();
+
+        let leftToRight =
+            bottom.mapToScene(bottomCenter.x, bottomCenter.y).y -
+            top.mapToScene(topCenter.x, topCenter.y).y;
+        let average = leftToRight / (this.itemList.length - 1);
+
+        for (let k = 1; k < this.itemList.length - 1; k++) {
+            let curItem = this.itemList[k];
+            if (curItem.moveable) {
+                let p1 = top.mapToScene(
+                    top.boundingRect().center().x,
+                    top.boundingRect().center().y
+                );
+                let p2 = curItem.mapFromScene(p1.x, p1.y + average * k);
+                curItem.y =
+                    p2.y - curItem.boundingRect().center().y + curItem.y;
+            }
+        }
+    } // Function alignVertical()
 
     /**
-     * 垂直分散
+     * 水平分布
      *
      * */
-    private alignHorizontal(): void {} // Function alignHorizontal()
+    private alignHorizontal(): void {
+        if (this.itemList.length < 3) {
+            return;
+        }
+        for (let i = 0; i < this.itemList.length - 1; i++) {
+            for (let j = 0; j < this.itemList.length - 1 - i; j++) {
+                let curItemCenter = this.itemList[j].boundingRect().center();
+                let nextItemCenter = this.itemList[j + 1]
+                    .boundingRect()
+                    .center();
+                let curCenterX = this.itemList[j].mapToScene(
+                    curItemCenter.x,
+                    curItemCenter.y
+                ).x;
+                let nextCenterX = this.itemList[j + 1].mapToScene(
+                    nextItemCenter.x,
+                    nextItemCenter.y
+                ).x;
+                if (curCenterX > nextCenterX) {
+                    let temp = this.itemList[j];
+                    this.itemList[j] = this.itemList[j + 1];
+                    this.itemList[j + 1] = temp;
+                }
+            }
+        }
+
+        let left = this.itemList[0];
+        let right = this.itemList[this.itemList.length - 1];
+
+        let leftCenter = left.boundingRect().center();
+        let rightCenter = right.boundingRect().center();
+
+        let leftToRight =
+            right.mapToScene(rightCenter.x, rightCenter.y).x -
+            left.mapToScene(leftCenter.x, leftCenter.y).x;
+        let average = leftToRight / (this.itemList.length - 1);
+
+        for (let k = 1; k < this.itemList.length - 1; k++) {
+            let curItem = this.itemList[k];
+            if (curItem.moveable) {
+                let p1 = left.mapToScene(
+                    left.boundingRect().center().x,
+                    left.boundingRect().center().y
+                );
+                let p2 = curItem.mapFromScene(p1.x + average * k, p1.y);
+                // 根据等式 newposx - oldposx = newcenterx - oldcenterx
+                curItem.x =
+                    p2.x - curItem.boundingRect().center().x + curItem.x;
+            }
+        }
+    } // Function alignHorizontal()
 } // Class SGraphSelectContainer

+ 2 - 2
saga-web-graph/src/enums/SGraphLayoutType.ts

@@ -17,7 +17,7 @@ export enum SGraphLayoutType {
     /** 底对齐 */
     Bottom,
     /** 水平居中    */
-    center,
+    Center,
     /** 垂直居中    */
-    middle
+    Middle
 } // Enum SGraphLayoutType