From 938ad30feb6a796759cf721647fa244f4514cfa5 Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Tue, 7 Jan 2025 17:32:36 +0900
Subject: [PATCH] =?UTF-8?q?=EC=A0=90=EC=84=A0=EA=B7=B8=EB=A6=AC=EB=93=9C?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../floor-plan/modal/grid/DotLineGrid.jsx     | 20 +++++++++++--------
 src/hooks/common/useGrid.js                   |  5 +++--
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/components/floor-plan/modal/grid/DotLineGrid.jsx b/src/components/floor-plan/modal/grid/DotLineGrid.jsx
index 67c4cdf3..da41fdcf 100644
--- a/src/components/floor-plan/modal/grid/DotLineGrid.jsx
+++ b/src/components/floor-plan/modal/grid/DotLineGrid.jsx
@@ -34,6 +34,7 @@ export default function DotLineGrid(props) {
   // 데이터를 최초 한 번만 조회
   useEffect(() => {
     console.log('DotLineGrid useEffect 실행')
+
     setSettingsDataSave({ ...settingsData })
 
     // dimension 값에 맞는 옵션을 선택
@@ -137,6 +138,7 @@ export default function DotLineGrid(props) {
 
   const changeDimension = (result) => {
     const { value } = result
+    setSelectOption(result)
     setCopyCurrentSetting((prev) => {
       return {
         ...prev,
@@ -268,14 +270,16 @@ export default function DotLineGrid(props) {
                 <span>mm</span>
               </div>
               <div className="grid-select">
-                <QSelectBox
-                  options={SelectOptions}
-                  onChange={changeDimension}
-                  value={selectOption}
-                  showKey={'name'}
-                  targetKey={'id'}
-                  sourceKey={'id'}
-                />
+                {selectOption && (
+                  <QSelectBox
+                    options={SelectOptions}
+                    onChange={changeDimension}
+                    value={selectOption}
+                    showKey={'name'}
+                    targetKey={'id'}
+                    sourceKey={'id'}
+                  />
+                )}
               </div>
             </div>
           </div>
diff --git a/src/hooks/common/useGrid.js b/src/hooks/common/useGrid.js
index 2b6e9ba9..abd2a6e0 100644
--- a/src/hooks/common/useGrid.js
+++ b/src/hooks/common/useGrid.js
@@ -15,12 +15,13 @@ export function useGrid() {
     if (!canvas) {
       return
     }
+
     const patternData = {
       dotGridDisplay: dotLineGridSetting.DOT,
       lineGridDisplay: dotLineGridSetting.LINE,
       gridType: dotLineGridSetting.INTERVAL.type,
-      gridHorizon: dotLineGridSetting.INTERVAL.horizontalInterval / 10,
-      gridVertical: dotLineGridSetting.INTERVAL.verticalInterval / 10,
+      gridHorizon: (dotLineGridSetting.INTERVAL.horizontalInterval / 10) * (dotLineGridSetting.INTERVAL.dimension ?? 1),
+      gridVertical: (dotLineGridSetting.INTERVAL.verticalInterval / 10) * (dotLineGridSetting.INTERVAL.dimension ?? 1),
       gridRatio: dotLineGridSetting.INTERVAL.ratioInterval / 10,
       gridDimen: dotLineGridSetting.INTERVAL.dimension,
     }