Jelajahi Sumber

计算绘制高度

Cyt928 5 tahun lalu
induk
melakukan
9fd9e75029
1 mengubah file dengan 8 tambahan dan 3 penghapusan
  1. 8 3
      src/components/Tree.vue

+ 8 - 3
src/components/Tree.vue

@@ -111,8 +111,13 @@ export default {
           }
         });
       }
+      // 计算所需容器高度
+      let maxPositionY = 0;
+      this.data.forEach((item) => {
+        if (item.positionY && item.positionY > maxPositionY) maxPositionY = item.positionY;
+      });
+      this.drawLine((maxPositionY * 130 + 100).toFixed(0));
       // 返回col
-      this.drawLine();
       return colList;
     },
   },
@@ -133,9 +138,9 @@ export default {
     initCanvasCtx() {
       this.ctx = document.getElementById('line-drawer').getContext('2d');
     },
-    drawLine() {
+    drawLine(height) {
       setTimeout(() => {
-        this.ctx.clearRect(0, 0, WIDTH, HEIGHT);
+        this.ctx.clearRect(0, 0, WIDTH, height > HEIGHT ? height : HEIGHT);
         this.ctx.lineWidth = 1;
         this.ctx.strokeStyle = '#bbbbbb';
         this.data.forEach((item) => {