helpGuideLine의 교차점 흡착추가

src/hooks/useEvent.js

@@ -2,7 +2,7 @@ import { useEffect, useRef } from 'react'
 import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
 import { canvasState, canvasZoomState, currentMenuState, textModeState } from '@/store/canvasAtom'
 import { fabric } from 'fabric'
-import { calculateDistance, distanceBetweenPoints, findClosestPoint } from '@/util/canvas-util'
+import { calculateDistance, calculateIntersection, distanceBetweenPoints, findClosestPoint, polygonToTurfPolygon } from '@/util/canvas-util'
 import { useAdsorptionPoint } from '@/hooks/useAdsorptionPoint'
 import { useDotLineGrid } from '@/hooks/useDotLineGrid'
 import { useTempGrid } from '@/hooks/useTempGrid'
@@ -151,6 +151,17 @@ export function useEvent() {
       }
     }
 
+    try {
+      const helpGuideLines = canvas.getObjects().filter((obj) => obj.name === 'helpGuideLine')
+      if (helpGuideLines.length === 2) {
+        const guideIntersectionPoint = calculateIntersection(helpGuideLines[0], helpGuideLines[1])
+
+        if (guideIntersectionPoint && distanceBetweenPoints(guideIntersectionPoint, pointer) <= adsorptionRange) {
+          arrivalPoint = guideIntersectionPoint
+        }
+      }
+    } catch (e) {}
+
     const horizontalLine = new fabric.Line([-1 * canvas.width, arrivalPoint.y, 2 * canvas.width, arrivalPoint.y], {
       stroke: 'red',
       strokeWidth: 1,