src/components/fabric/QLine.js

@@ -182,4 +182,46 @@ export const QLine = fabric.util.createClass(fabric.Line, {
     }
     return this
   },
+
+  containsPoint: function(point) {
+    const boundingRect = this.getBoundingRect(true)
+
+    // 선의 방향 판단
+    const dx = Math.abs(this.x2 - this.x1)
+    const dy = Math.abs(this.y2 - this.y1)
+    const isVertical = dx < dy && dx < 10 // 세로선 (가로 변화가 작음)
+    const isDiagonal = dx > 10 && dy > 10 // 대각선 (가로, 세로 모두 변화)
+
+    let reducedWidth, reducedHeight
+
+    if (isDiagonal) {
+      // 대각선의 경우: 1/2 크기
+      reducedWidth = boundingRect.width / 2
+      reducedHeight = boundingRect.height / 2
+    } else if (isVertical) {
+      // 세로선의 경우: 가로 선택범위 2배
+      reducedWidth = boundingRect.width * 2
+      reducedHeight = boundingRect.height / 3
+    } else {
+      // 가로선의 경우: 세로 선택범위 2배
+      reducedWidth = boundingRect.width / 3
+      reducedHeight = boundingRect.height * 2
+    }
+
+    // 축소된 영역의 중심점 계산
+    const centerX = boundingRect.left + boundingRect.width / 2
+    const centerY = boundingRect.top + boundingRect.height / 2
+
+    // 축소된 영역의 경계 계산
+    const left = centerX - reducedWidth / 2
+    const top = centerY - reducedHeight / 2
+    const right = centerX + reducedWidth / 2
+    const bottom = centerY + reducedHeight / 2
+
+    // 점이 축소된 영역 내에 있는지 확인
+    return point.x >= left &&
+           point.x <= right &&
+           point.y >= top &&
+           point.y <= bottom
+  },
 })