lengthText 생성 시 글꼴 설정 추가

src/components/fabric/QLine.js

@@ -152,7 +152,7 @@ export const QLine = fabric.util.createClass(fabric.Line, {
 
   getLength() {
     //10배 곱해진 값 return
-    return Number(this.length.toFixed(2) * 10)
+    return Number(this.length.toFixed(1)) * 10
   },
 
   setViewLengthText(bool) {

src/components/fabric/QPolygon.js

@@ -183,7 +183,7 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
       const end = points[(i + 1) % points.length]
       const dx = end.x - start.x
       const dy = end.y - start.y
-      const length = Number(Math.sqrt(dx * dx + dy * dy).toFixed(2)) * 10
+      const length = Number(Math.sqrt(dx * dx + dy * dy).toFixed(1)) * 10
 
       let midPoint
 

src/hooks/useCanvasEvent.js

@@ -11,6 +11,7 @@ import {
   modifiedPlanFlagState,
 } from '@/store/canvasAtom'
 import { QPolygon } from '@/components/fabric/QPolygon'
+import { fontSelector } from '@/store/fontAtom'
 
 // 캔버스에 필요한 이벤트
 export function useCanvasEvent() {
@@ -22,6 +23,7 @@ export function useCanvasEvent() {
   const fontFamily = useRecoilValue(fontFamilyState)
   const [canvasZoom, setCanvasZoom] = useRecoilState(canvasZoomState)
   const [modifiedPlanFlag, setModifiedPlanFlag] = useRecoilState(modifiedPlanFlagState)
+  const lengthTextOption = useRecoilValue(fontSelector('lengthText'))
 
   // 기본적인 이벤트 필요시 추가
   const attachDefaultEventOnCanvas = () => {
@@ -108,16 +110,17 @@ export function useCanvasEvent() {
         })
       }
 
-      if (target.type.toLowerCase().includes('text')) {
+      if (target.name === 'lengthText' && target.type.toLowerCase().includes('text') > 0) {
-        target.set({ fontSize })
-        target.set({ fontFamily })
-      }
-
-      if (target.name === 'lengthText') {
         const x = target.left
         const y = target.top
         target.lockMovementX = false
         target.lockMovementY = false
+
+        target.fill = lengthTextOption.fontColor.value
+        target.fontFamily = lengthTextOption.fontFamily.value
+        target.fontSize = lengthTextOption.fontSize.value
+        target.fontWeight = lengthTextOption.fontWeight.value
+
         // Add a property to store the previous value
         const previousValue = target.text
         target.on('selected', (e) => {