Browse Source

完善蛇形。

jiaxiaoqiang 5 months ago
parent
commit
7708b51044
1 changed files with 14 additions and 6 deletions
  1. 14 6
      src/hooks/vueflowHooks.ts

+ 14 - 6
src/hooks/vueflowHooks.ts

@@ -1,13 +1,21 @@
+import { paddingLeft } from "html2canvas/dist/types/css/property-descriptors/padding";
+
 export const useSnakeLayoutHook = (
   nodes: any[],
-  canvasHeight: number,
-  spacingY: number = 150,
-  spacingX: number = 150
+  canvasHeight: number = 100,
+  spacingY: number = 100,
+  spacingX: number = 200
 ) => {
   const snakeNodes = [];
 
+  // 内边距
+  const paddingTop = 35;
+  const paddingLeft = 15;
+
   console.log("hook", nodes);
-  const nodesPerColumn = Math.floor(canvasHeight / spacingY);
+
+  // 这是每一个个列的数量  列数量
+  const nodesPerColumn = 6; //Math.floor(canvasHeight / spacingY);
 
   // console.log(canvasHeight, canvasHeight / spacingY);
 
@@ -20,8 +28,8 @@ export const useSnakeLayoutHook = (
     // const adjustedRow = col % 2 === 0 ? row : nodesPerColumn - 1 - row;
 
     node.position = {
-      x: col * spacingX,
-      y: adjustedRow * spacingY,
+      x: col * spacingX + paddingLeft,
+      y: adjustedRow * spacingY + paddingTop,
     };
 
     // 更新奇数列的 handle 处理