First Commit

components/charts/AsalDaerahChart.tsx

@@ -253,6 +253,15 @@ export default function AsalDaerahChart() {
     );
   }
 
+  // Calculate dynamic height based on number of kabupaten
+  const calculateHeight = () => {
+    const minHeight = 200;
+    const barHeight = 25; // Height per bar in pixels
+    const padding = 100; // Extra space for title, legend, etc.
+    const dynamicHeight = Math.max(minHeight, (data.length * barHeight) + padding);
+    return `${dynamicHeight}px`;
+  };
+
   return (
     <Card className="bg-white dark:bg-slate-900 shadow-lg">
       <CardHeader>
@@ -261,7 +270,10 @@ export default function AsalDaerahChart() {
         </CardTitle>
       </CardHeader>
       <CardContent>
-        <div className="h-[400px] sm:h-[400px] md:h-[400px] w-full max-w-5xl mx-auto">
+        <div 
+          className="w-full max-w-5xl mx-auto"
+          style={{ height: calculateHeight() }}
+        >
           <Chart
             options={options}
             series={series}