diff --git a/src/components/floor-plan/modal/lineTypes/RightAngle.jsx b/src/components/floor-plan/modal/lineTypes/RightAngle.jsx
index b217a867..3f64cd1e 100644
--- a/src/components/floor-plan/modal/lineTypes/RightAngle.jsx
+++ b/src/components/floor-plan/modal/lineTypes/RightAngle.jsx
@@ -4,6 +4,18 @@ import { onlyNumberInputChange } from '@/util/input-utils'
 export default function RightAngle({ props }) {
   const { getMessage } = useMessage()
   const { length1, setLength1, length1Ref, length2, setLength2, length2Ref, arrow1, setArrow1, arrow2, setArrow2 } = props
+
+  const handleClickArrow = (arrow) => {
+    const arrowType = arrow === '↑' ? 'ArrowUp' : arrow === '↓' ? 'ArrowDown' : arrow === '←' ? 'ArrowLeft' : arrow === '→' ? 'ArrowRight' : ''
+    setArrow2(arrow)
+    const originLeng2Val = length2Ref.current.value
+    if (originLeng2Val === '') {
+      length2Ref.current.value = '0'
+    }
+    length2Ref.current.focus()
+    length2Ref.current.value = originLeng2Val
+    document.dispatchEvent(new KeyboardEvent('keydown', { key: arrowType }))
+  }
   return (
     <div className="outline-wrap">
       <div className="outline-inner">
@@ -89,29 +101,25 @@ export default function RightAngle({ props }) {
             <button
               className={`direction up ${arrow2 === '↑' ? 'act' : ''}`}
               onClick={() => {
-                setArrow2('↑')
-                document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
+                handleClickArrow('↑')
               }}
             ></button>
             <button
               className={`direction down ${arrow2 === '↓' ? 'act' : ''}`}
               onClick={() => {
-                setArrow2('↓')
-                document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
+                handleClickArrow('↓')
               }}
             ></button>
             <button
               className={`direction left ${arrow2 === '←' ? 'act' : ''}`}
               onClick={() => {
-                setArrow2('←')
-                document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
+                handleClickArrow('←')
               }}
             ></button>
             <button
               className={`direction right ${arrow2 === '→' ? 'act' : ''}`}
               onClick={() => {
-                setArrow2('→')
-                document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
+                handleClickArrow('→')
               }}
             ></button>
           </div>
diff --git a/src/hooks/module/useTrestle.js b/src/hooks/module/useTrestle.js
index 5132a344..17f6711a 100644
--- a/src/hooks/module/useTrestle.js
+++ b/src/hooks/module/useTrestle.js
@@ -807,60 +807,59 @@ export const useTrestle = () => {
   const getAzimuth = (parent) => {
     const { moduleCompass, surfaceCompass, direction } = parent
 
-    if (surfaceCompass) {
-      if (surfaceCompass > 180) {
-        return surfaceCompass - 360
-      }
-      return surfaceCompass
-    }
+    let resultAzimuth = surfaceCompass || moduleCompass
+
 
     switch (direction) {
       case 'south': {
-        if (moduleCompass < 0) {
-          return -1 * moduleCompass
-        } else if (moduleCompass === 0) {
+        if (resultAzimuth < 0) {
+          return -1 * resultAzimuth
+        } else if (resultAzimuth === 0) {
           return 0
-        } else if (moduleCompass < 180) {
-          return -1 * moduleCompass
-        } else if (moduleCompass === 180) {
+        } else if (resultAzimuth < 180) {
+          return -1 * resultAzimuth
+        } else if (resultAzimuth === 180) {
           return 180
         }
       }
       case 'north': {
-        if (moduleCompass < 0) {
-          return -1 * (180 + moduleCompass)
-        } else if (moduleCompass === 0) {
+        if (resultAzimuth < 0) {
+          return -1 * (180 + resultAzimuth)
+        } else if (resultAzimuth === 0) {
           return 180
-        } else if (moduleCompass < 180) {
-          return 180 - moduleCompass
-        } else if (moduleCompass === 180) {
+        } else if (resultAzimuth < 180) {
+          return 180 - resultAzimuth
+        } else if (resultAzimuth === 180) {
           return 0
         }
       }
       case 'west': {
-        if (moduleCompass > -180 && moduleCompass < -90) {
-          return -180 - (90 + moduleCompass)
-        } else if (moduleCompass < 0) {
-          return 180 - (90 + moduleCompass)
-        } else if (moduleCompass === 0) {
-          return 90
-        } else if (moduleCompass < 180) {
-          return 90 - moduleCompass
-        } else if (moduleCompass === 180) {
-          return -90
+        if (resultAzimuth > -180 && resultAzimuth < 0) {
+          return -1 * (90 + resultAzimuth)
+        } else if (resultAzimuth === 0) {
+          return -180 + (90 - resultAzimuth)
+        } else if (resultAzimuth < 180) {
+          if (resultAzimuth > 90) {
+            return 180 + (90 - resultAzimuth)
+          }
+          return -180 + (90 - resultAzimuth)
+        } else if (resultAzimuth === 180) {
+          return 180 + (90 - resultAzimuth)
         }
       }
+
       case 'east': {
-        if (moduleCompass < 0) {
-          return -(90 + moduleCompass)
-        } else if (moduleCompass === 0) {
-          return -90
-        } else if (moduleCompass < 90) {
-          return -180 + (90 - moduleCompass)
-        } else if (moduleCompass < 180) {
-          return 180 + (90 - moduleCompass)
-        } else if (moduleCompass === 180) {
-          return 90
+        if (resultAzimuth === 0) {
+          return 90 - resultAzimuth
+        } else if (resultAzimuth > 0 && resultAzimuth < 180) {
+          return 90 - resultAzimuth
+        } else if (resultAzimuth === 180) {
+          return 90 - resultAzimuth
+        } else if (resultAzimuth > -180 && resultAzimuth < 0) {
+          if (resultAzimuth < -90) {
+            return -180 - (90 + resultAzimuth)
+          }
+          return 180 - (90 + resultAzimuth)
         }
       }
     }