바차트 크기비율 조정

packages/common/business_components/src/ui/chart/BarChart.tsx

@@ -74,17 +74,25 @@ const CustomLegend = (props: any) => {
   );
 };
 
+// chartData의 모든 값 중 최대값 구하기
+const getGlobalMax = (data: Record<string, number>[]) => {
+  if (!data || data.length === 0) return 0;
+  return Math.max(
+    ...data.flatMap(item =>
+      Object.entries(item)
+        .filter(([key]) => key !== 'label')
+        .map(([, value]) => value as number)
+    )
+  );
+};
+
 export default function Chart({chartConfig=undefined, chartData=[], chartTitle='차트', chartClassName='w-full h-full', graphSize=40, yFieldText='', showLegend=false} : BarChartProps) {
   const colors = ["#FF6B6B", "#4ECDC4", "#45B7D1", "#FED16A", "#FFEEAD", "#D4A5A5"];
-   const getMaxValue = (data: any[], keyPrefix: string) => {
-    return Math.max(...data.map(item => 
-      Object.keys(item)
-        .filter(key => key.includes(keyPrefix))
-        .map(key => item[key])
-    ).flat());
-  };
-
-  const barMaxValue = getMaxValue(chartData, 'barVal');
+  const globalMax = getGlobalMax(chartData);
+  const tickCount = 5;
+  // interval을 globalMax / tickCount로 계산
+  const interval = globalMax / tickCount;
+  const ticks = Array.from({ length: tickCount + 1 }, (_, i) => Math.round(interval * i));
   return (
     <>
     {chartTitle && chartTitle !== "" && chartTitle !== "undefined" ? (
@@ -93,8 +101,8 @@ export default function Chart({chartConfig=undefined, chartData=[], chartTitle='
       </div>): null}
       <div className="flex justify-center">
         <ChartContainer config={chartConfig ?? {}} className={chartClassName + " !w-[90%]"}>
-          <BarChart accessibilityLayer data={chartData}>
-            <CartesianGrid vertical={false} />
+          <BarChart accessibilityLayer data={chartData} className="!h-[88%]">
+            <CartesianGrid vertical={false} className="!h-[85%]" />
             <XAxis
               dataKey="label"
               tickLine={true}
@@ -106,12 +114,12 @@ export default function Chart({chartConfig=undefined, chartData=[], chartTitle='
             <YAxis 
               tickLine={true}
               tickMargin={10}
-              tickCount={6}
               axisLine={true}
               fontSize={12}
               fontWeight={500}
-              domain={[0, Math.ceil(barMaxValue * 1)]}
-              label={yFieldText ? { value: yFieldText, className:"text-[13px] font-bold", position: 'insideLeft', angle: -90, offset: 20 } : undefined}
+              domain={[0, globalMax]}
+              ticks={ticks}
+              label={yFieldText ? { value: yFieldText, className:"text-[15px] font-bold", position: 'insideLeft', angle: -90, offset: -30 } : undefined}
             />
             <ChartTooltip cursor={false} content={<CustomTooltip active={undefined} payload={undefined} label={undefined} />}/>
             {chartData && chartData.length > 0 && (