diff --git a/webserver/src/Pages/DashboardPage/DashboardPage.jsx b/webserver/src/Pages/DashboardPage/DashboardPage.jsx
index d86efe3..8938979 100644
--- a/webserver/src/Pages/DashboardPage/DashboardPage.jsx
+++ b/webserver/src/Pages/DashboardPage/DashboardPage.jsx
@@ -1,10 +1,32 @@
 import React from "react";
+import "chart.js/auto";
 import { useLocalDb } from "../../DbContext";
-import { Bar, Chart } from "react-chartjs-2";
+import { Pie, Bar, Chart } from "react-chartjs-2";
+import { useProcessedDataBucket } from "../../ProcessedDataBucketContext";
 
 const DashboardPage = () => {
   //https://react-charts.js.org/examples/column
-  return <div></div>;
+  const pdb = useProcessedDataBucket();
+  const makePieChartData = (pdb, team_num) => {
+    // console.log(team_num);
+    // console.log(pdb.teamData);
+    return {
+      labels: ["None", "Low", "Mid", "High", "Transversal"],
+      datasets: [
+        {
+          label: "Climbs",
+          data: pdb.teamData[4388].climb_counts,
+          backgroundColor: ["rgba(230,20,20)", "rgba(230,150,20)", "rgba(150,230,20)", "rgba(20,230,70)", "rgba(20,200,180)"],
+        },
+      ],
+    };
+  };
+  // console.log(pdb);
+  return (
+    <div>
+      <Pie data={makePieChartData(pdb, 4388)} />
+    </div>
+  );
 };
 
 export default DashboardPage;
diff --git a/webserver/src/ProcessedDataBucket.jsx b/webserver/src/ProcessedDataBucket.jsx
index 409f3e2..50c1aa3 100644
--- a/webserver/src/ProcessedDataBucket.jsx
+++ b/webserver/src/ProcessedDataBucket.jsx
@@ -28,11 +28,12 @@ export class ProcessedDataBucket {
                   lower_hub_teleop: [],
                   match_points: [],
                 },
-                climbs_none: 0,
-                climbs_low: 0,
-                climbs_mid: 0,
-                climbs_high: 0,
-                climbs_transverse: 0,
+                climb_counts: [0, 0, 0, 0, 0],
+                // climbs_none: 0,
+                // climbs_low: 0,
+                // climbs_mid: 0,
+                // climbs_high: 0,
+                // climbs_transverse: 0,
                 points_average: 0,
                 num_disables: 0,
                 num_flips: 0,
@@ -65,26 +66,27 @@ export class ProcessedDataBucket {
             thisTeamData.data_sets.match_points.push(match_points);
 
             //climb data
-            switch (parseInt(doc.climb_level)) {
-              case 0:
-                thisTeamData.climbs_none++;
-                break;
-              case 1:
-                thisTeamData.climbs_low++;
-                break;
-              case 2:
-                thisTeamData.climbs_mid++;
-                break;
-              case 3:
-                thisTeamData.climbs_high++;
-                break;
-              case 4:
-                thisTeamData.climbs_transverse++;
-                break;
-              default:
-                console.error("Invalid Climb Level (how did this even happen lol?): " + doc.climb_level);
-                break;
-            }
+            thisTeamData.climb_counts[parseInt(doc.climb_level)]++;
+            // switch (parseInt(doc.climb_level)) {
+            //   case 0:
+            //     thisTeamData.climbs_none++;
+            //     break;
+            //   case 1:
+            //     thisTeamData.climbs_low++;
+            //     break;
+            //   case 2:
+            //     thisTeamData.climbs_mid++;
+            //     break;
+            //   case 3:
+            //     thisTeamData.climbs_high++;
+            //     break;
+            //   case 4:
+            //     thisTeamData.climbs_transverse++;
+            //     break;
+            //   default:
+            //     console.error("Invalid Climb Level (how did this even happen lol?): " + doc.climb_level);
+            //     break;
+            // }
 
             //misc data
             thisTeamData.num_disables += doc.disabled ? 1 : 0;