Bar chart issue fixed.

muhammadsalif · Jul 8, 2020 · 2c4c34c · 2c4c34c
1 parent a15696d
commit 2c4c34c
Showing 1 changed file with 16 additions and 33 deletions.
diff --git a/src/charts/BarChart.jsx b/src/charts/BarChart.jsx
@@ -6,41 +6,24 @@ export default function BarChart({ cases, active, recovered, deaths }) {
     labels: ["Total Cases", "Active", "Recovered", "Deaths"],
     datasets: [
       {
-        label: "Total Cases",
-        backgroundColor: "rgba(0,0,255,0.2)",
-        borderColor: "rgba(0,0,255,1)",
+        // label: ("Total Cases", "Active","Recovered","Deaths"),
+        label: "Bars",
+        backgroundColor: [
+          "rgba(0,0,255,0.2)",
+          "rgba(255,215,0,0.2)",
+          "rgba(0,255,0,0.2)",
+          "rgba(255,99,132,0.2)",
+        ],
+        borderColor: [
+          "rgba(0,0,255,1)",
+          "rgba(255,215,0,1)",
+          "rgba(0,255,0,1)",
+          "rgba(255,99,132,1)",
+        ],
         borderWidth: 1,
         hoverBackgroundColor: "rgba(255,99,132,0.4)",
         hoverBorderColor: "rgba(255,99,132,1)",
-        data: [cases],
-      },
-      {
-        label: "Active",
-        backgroundColor: "rgba(255,215,0,0.2)",
-        borderColor: "rgba(255,215,0,1)",
-        borderWidth: 1,
-        hoverBackgroundColor: "rgba(255,99,132,0.4)",
-        hoverBorderColor: "rgba(255,99,132,1)",
-        data: [active],
-      },
-
-      {
-        label: "Recovered",
-        backgroundColor: "rgba(0,255,0,0.2)",
-        borderColor: "rgba(0,255,0,1)",
-        borderWidth: 1,
-        hoverBackgroundColor: "rgba(255,99,132,0.4)",
-        hoverBorderColor: "rgba(255,99,132,1)",
-        data: [recovered],
-      },
-      {
-        label: "Deaths",
-        backgroundColor: "rgba(255,99,132,0.2)",
-        borderColor: "rgba(255,99,132,1)",
-        borderWidth: 1,
-        hoverBackgroundColor: "rgba(255,99,132,0.4)",
-        hoverBorderColor: "rgba(255,99,132,1)",
-        data: [deaths],
+        data: [cases, active, recovered, deaths],
       },
     ],
   };
@@ -53,7 +36,7 @@ export default function BarChart({ cases, active, recovered, deaths }) {
         <Bar
           data={data}
           width={100}
-          height={80}
+          height={150}
           options={{
             maintainAspectRatio: false,
           }}