iwa-panda2

commit 872a841f6aefd6ee812a362b7873b6183a88e6bb
parent 634f0bb07e7fadc7d4a7c8429d336260cafe155f
Author: Kninteman <[email protected]>
Date:   Mon, 12 Jun 2023 15:19:58 +0200

Graph cleanup

Diffstat:
M
css/dashboard.css
 | 
8
++++----
M
js/panda.js
 | 
35
+++++++++++++++++++++--------------

2 files changed, 25 insertions(+), 18 deletions(-)
diff --git a/css/dashboard.css b/css/dashboard.css
@@ -71,7 +71,7 @@ h1 {
     width: 90vw;
     height: auto;
     padding-top: 20px;
-    margin: 5vw auto 1vw;
+    margin: 5vw auto 5vw;
     justify-content: space-between;
     background-color: #333333;
     color: white;
@@ -80,7 +80,7 @@ h1 {
 }
 
 .block2 {
-    margin: 10vw auto 1vw;
+    margin: 10vw auto 110vw;
 }
 
 .content {
@@ -154,11 +154,11 @@ h1 {
 
     /* DATA BLOCKS */
     .block1 {
-        margin: 20px auto 4px;
+        margin: 20px auto 20px;
     }
 
     .block2 {
-        margin: 40px auto 2px;
+        margin: 40px auto 40px;
     }
 
     .content h2 {
diff --git a/js/panda.js b/js/panda.js
@@ -43,31 +43,31 @@ var ctx = document.getElementById('myChart').getContext('2d');
 
 // Create the chart
 var myChart = new Chart(ctx, {
-    type: 'line', // Specify the type of chart (e.g., bar, line, pie, etc.)
+    type: 'line',
     data: {
-        labels: ['Day 1', 'Day 2', 'Day 3', 'Day 4', 'Day 5'], // Specify the labels for the x-axis
+        labels: ['Day 1', 'Day 2', 'Day 3', 'Day 4', 'Day 5'],
         datasets: [
             {
-                label: 'Dataset 1', // Specify the label for the dataset
-                data: [1, 2, 3, 4, 5], // Pass your array of data points here
-                backgroundColor: 'white', // Specify the background color of the bars/points
-                borderColor: 'white', // Specify the border color of the bars/points
-                borderWidth: 2 // Specify the border width
+                label: 'Dataset 1',
+                data: [1, 2, 3, 4, 5],
+                backgroundColor: 'rgba(176, 204, 207, 1)',
+                borderColor: 'rgba(176, 204, 207, 1)',
+                borderWidth: 2
             },
             {
-                label: 'Dataset 2', // Specify the label for the dataset
-                data: [6, 7, 8, 9, 10], // Pass your array of data points here
-                backgroundColor: 'rgba(72, 150, 25, 1)', // Specify the background color of the bars/points
-                borderColor: 'rgba(72, 150, 25, 1)', // Specify the border color of the bars/points
-                borderWidth: 2 // Specify the border width
+                label: 'Dataset 2',
+                data: [6, 7, 8, 9, 10],
+                backgroundColor: 'rgba(195, 176, 207, 1)',
+                borderColor: 'rgba(195, 176, 207, 1)',
+                borderWidth: 2
             }
         ]
     },
     options: {
-        responsive: true, // Make the chart responsive
+        responsive: true,
         scales: {
             y: {
-                beginAtZero: true, // Start the y-axis at zero
+                beginAtZero: true,
                 ticks: {
                     color: 'white'
                 }
@@ -77,6 +77,13 @@ var myChart = new Chart(ctx, {
                     color: 'white'
                 }
             }
+        },
+        plugins: {
+            legend: {
+                labels: {
+                    color: 'white'
+                }
+            }
         }
     }
 });
 \ No newline at end of file