diff --git a/packages/common/business_components/src/ui/chart/BarChart.tsx b/packages/common/business_components/src/ui/chart/BarChart.tsx index 218ebac34..79aa61c98 100644 --- a/packages/common/business_components/src/ui/chart/BarChart.tsx +++ b/packages/common/business_components/src/ui/chart/BarChart.tsx @@ -6,6 +6,7 @@ import { type ChartConfig } from "./lib/chart"; import type { CSSProperties } from "react"; +import { formatCommaNumber } from "./lib/function"; const customStyles = { legendContainer: { @@ -119,6 +120,7 @@ export default function Chart({chartConfig=undefined, chartData=[], chartTitle=' fontWeight={500} domain={[0, globalMax]} ticks={ticks} + tickFormatter={(value) => formatCommaNumber(value)} label={yFieldText ? { value: yFieldText, className:"text-[15px] font-bold", position: 'insideLeft', angle: -90, offset: -30 } : undefined} /> }/> diff --git a/packages/common/business_components/src/ui/chart/lib/function.tsx b/packages/common/business_components/src/ui/chart/lib/function.tsx new file mode 100644 index 000000000..dc1921f0a --- /dev/null +++ b/packages/common/business_components/src/ui/chart/lib/function.tsx @@ -0,0 +1,12 @@ +// 숫자입력시 , 삽입 +export const formatCommaNumber = ( + value: number | string | undefined | null +): string => { + if (value === undefined || value === null || value === "") return ""; + const num = Number(value); + // 숫자로 변환할 수 없는 값이 들어올 경우 빈 문자열을 반환하여 예상치 못한 "NaN" 출력을 방지합니다. + if (isNaN(num)) { + return ""; + } + return num.toLocaleString(); +}; \ No newline at end of file diff --git a/packages/common/business_components/src/ui/map/Gis.js b/packages/common/business_components/src/ui/map/Gis.js index a723b2340..5386207d8 100644 --- a/packages/common/business_components/src/ui/map/Gis.js +++ b/packages/common/business_components/src/ui/map/Gis.js @@ -86,20 +86,28 @@ function Gis({ foundFeature = data; } else { // 아니면 featureId로 맵에서 Feature 인스턴스를 찾아서 사용 - let featureId + let featureId = data.fid; const layerName = layerNmRef.current if (layerName === '하수재이용시설') { featureId = data.searchPk; - } else if (layerName === '빗물이용시설'|| layerName == '중수도시설') { + } else if (layerName === '빗물이용시설' || layerName == '중수도시설') { featureId = data.bdstInfoSn; - } else if (layerName === '하수처리시설') { + } else if (layerName === '하수처리시설') { featureId = data.bscFctCd; - } else if (layerName === '온배수시설' ) { + } else if (layerName === '온배수시설') { featureId = data.bdstRuseFcltSn; - } else { + } else { console.warn('해당 레이어에 대한 featureId 매핑 없음', layerNm); featureId = data.fid || data.id || data.ftrIdn; - } + } + // gisMap.getLayers().getArray().forEach(layer => { + // const source = layer.getSource?.(); + // if (source?.getFeatureById) { + // const feature = source.getFeatureById(String(featureId).trim()); + // if (feature) foundFeature = feature; + // } + // }); + // const [layerType, id] = String(featureId).split('.'); gisMap.getLayers().getArray().forEach(layer => { const source = layer.getSource?.(); if (source?.getFeatures) {