agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.scss

@@ -6,8 +6,8 @@
   }
   
   canvas {
-    width: max-content;
-    height: 80%!important;
+    width: 100%;
+    height: 30vh;
     margin: 20px;
     align-items: center;
   }

agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.ts

@@ -57,6 +57,14 @@ export class GraphComponent implements OnInit {
     this.selectedSensor = 'dht';
     this.parameters = this.sensorParameters[this.selectedSensor];
     this.createChart(this.dhtData.temperature, 'Temperature', '#8F5A62', this.labelHourly);
+
+    window.addEventListener('resize', () => {
+      if (this.chart) {
+        this.chart.destroy();
+        this.createChart(this.dhtData.temperature, 'Temperature', '#8F5A62', this.labelHourly);
+      }
+    });
+    
   }
 
   createChart(data: number[], label: string, borderColor: string, labels: string[]): void {
@@ -131,9 +139,15 @@ export class GraphComponent implements OnInit {
           },
           scales: {
             x: {
+              grid:{
+                display: false
+              },
               beginAtZero: true
             },
             y: {
+              grid:{
+                display: false
+              },
               beginAtZero: true
             }
           }