흡착점 작동 관련 수정

src/components/floor-plan/modal/setting01/SecondOption.jsx

@@ -185,7 +185,7 @@ export default function SecondOption(props) {
 
   const onClickOption = async (item) => {
     let option4Data = settingModalSecondOptions?.option4
-    let adsorpPointData = adsorptionPointMode.adsorptionPoint
+    let adsorpPointData = adsorptionPointMode
 
     //흡착범위 설정(단 건 선택)
     if (
@@ -203,11 +203,9 @@ export default function SecondOption(props) {
 
       //흡착점 범위
       setAdsorptionRange(item.range)
-
+      setAdsorptionPointMode(adsorpPointData)
-      setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: adsorpPointData })
     } else if (item === 'adsorpPoint') {
-      setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: !adsorpPointData })
+      setAdsorptionPointMode(!adsorpPointData)
-      adsorpPointData = !adsorpPointData
     }
 
     setSettingsData({ ...settingsData, option4: [...option4Data], adsorptionPoint: adsorpPointData })
@@ -257,7 +255,7 @@ export default function SecondOption(props) {
             }}
           >
             <span>{getMessage('modal.canvas.setting.font.plan.absorption.point')}</span>
-            <i>{adsorptionPointMode.adsorptionPoint ? 'ON' : 'OFF'}</i>
+            <i>{adsorptionPointMode ? 'ON' : 'OFF'}</i>
           </button>
         </div>
       </div>

src/hooks/option/useCanvasSetting.js

@@ -609,7 +609,7 @@ export function useCanvasSetting(executeEffect = true) {
         const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item }))
 
         /** 흡착점 ON/OFF */
-        setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: res.adsorpPoint })
+        setAdsorptionPointMode(res.adsorpPoint)
 
         /** 치수선 설정 */
         setDimensionLineSettings({ ...dimensionLineSettings, pixel: res.originPixel, color: res.originColor })
@@ -695,7 +695,7 @@ export function useCanvasSetting(executeEffect = true) {
         /** 조회된 글꼴 데이터가 없는 경우 (데이터 초기화) */
 
         /** 흡착점 ON/OFF */
-        setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false })
+        setAdsorptionPointMode(false)
 
         /** 치수선 설정 */
         resetDimensionLineSettings()
@@ -775,7 +775,7 @@ export function useCanvasSetting(executeEffect = true) {
       adsorpRangeMedium: dataToSend.secondOption2[2].selected,
       adsorpRangeLarge: dataToSend.secondOption2[3].selected,
       /** 흡착점 ON/OFF */
-      adsorpPoint: adsorptionPointMode.adsorptionPoint,
+      adsorpPoint: adsorptionPointMode,
       //??: adsorptionRange, 사용여부 확인 필요
 
       /** 문자 글꼴 설정 */

src/hooks/useEvent.js

@@ -104,24 +104,35 @@ export function useEvent() {
       if (dotLineGridSetting.LINE || canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name)).length > 0) {
         const closestLine = getClosestLineGrid(pointer)
 
-        const horizonLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'horizontal')
+        const horizonLines = canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name) && obj.direction === 'horizontal')
-        const verticalLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'vertical')
+        const verticalLines = canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name) && obj.direction === 'vertical')
 
         if (!horizonLines || !verticalLines) {
           return
         }
 
-        const closestHorizontalLine = horizonLines.reduce((prev, curr) => {
+        let closestHorizontalLine = null
-          const prevDistance = calculateDistance(pointer, prev)
+        let closestVerticalLine = null
-          const currDistance = calculateDistance(pointer, curr)
-          return prevDistance < currDistance ? prev : curr
-        })
 
-        const closestVerticalLine = verticalLines.reduce((prev, curr) => {
+        if (horizonLines && horizonLines.length > 0) {
-          const prevDistance = calculateDistance(pointer, prev)
+          closestHorizontalLine = horizonLines.reduce((prev, curr) => {
-          const currDistance = calculateDistance(pointer, curr)
+            const prevDistance = calculateDistance(pointer, prev)
-          return prevDistance < currDistance ? prev : curr
+            const currDistance = calculateDistance(pointer, curr)
-        })
+            return prevDistance < currDistance ? prev : curr
+          })
+        }
+
+        if (verticalLines && verticalLines.length > 0) {
+          closestVerticalLine = verticalLines.reduce((prev, curr) => {
+            const prevDistance = calculateDistance(pointer, prev)
+            const currDistance = calculateDistance(pointer, curr)
+            return prevDistance < currDistance ? prev : curr
+          })
+        }
+
+        if (!closestVerticalLine || !closestHorizontalLine) {
+          return
+        }
 
         const closestIntersectionPoint = calculateIntersection(closestHorizontalLine, closestVerticalLine)