colors

web/app/Sensor/MemInfo.php

@@ -15,19 +15,19 @@ class MemInfo extends AbstractSensor {
         $records = $this->getLastRecords("memory", 288);
 
         $used = [];
-        $used_cached = [];
+        $cached = [];
         foreach ($records as $record) {
             $meminfo = $this->parseMeminfo($record->memory);
             $used[] = new Point(
                     $record->time * 1000, $meminfo->used() / 1000);
-            $used_cached[] = new Point(
+            $cached[] = new Point(
                     $record->time * 1000,
-                    ($meminfo->used() + $meminfo->cached) / 1000);
+                    $meminfo->cached / 1000);
         }
 
         return view("agent.meminfo", [
             "used" => $used,
-            "used_cached" => $used_cached,
+            "cached" => $cached,
             "server" => $this->getServer()]);
     }
 

web/resources/views/agent/meminfo.blade.php

 
 <canvas id="memory-chart" width='400' height='300'></canvas>
 <script>
+    window.chartColors = {
+	red: 'rgba(255, 99, 132, 0.2)',
+	orange: 'rgba(255, 165, 0, 0.3)',
+        yellow: 'rgba(255, 205, 86, 0.2)',
+        green: 'rgba(0, 178, 0, 0.3)',
+        blue: 'rgba(54, 162, 235, 0.2)',
+        purple: 'rgba(153, 102, 255, 0.2)',
+        grey: 'rgba(201, 203, 207, 0.2)'
+    };
     var ctx = document.getElementById('memory-chart').getContext('2d');
     var myChart = new Chart(ctx, {
         type: 'line',
         data: {
             datasets: [{
                 label: 'Used',
+                backgroundColor: window.chartColors.green,
+		borderColor: window.chartColors.green,
                 data: {!! json_encode($used) !!},
             },{
                 label: 'Cached',
-                data: {!! json_encode($used_cached) !!},
+                backgroundColor: window.chartColors.orange,
+		borderColor: window.chartColors.orange,
+                data: {!! json_encode($cached) !!},
             }]
         },
         options: {
@@ -27,6 +40,7 @@
                     }
                 }],
                 yAxes: [{
+                    stacked: true,
                     ticks: {
                         beginAtZero:true
                     },