A bundle of health chart improvements (#2389)

Add min and max value calculations for health charts

    Chart.js failed to handle some big (scientific notation) numbers.

This also adds 1 to the max and subtracts 1 on the min for values that
we don't know the range of. This makes values that do not change much
    look more reasonable.

Author: lawik

assets/ui-rework/hooks/chart.js

@@ -12,6 +12,8 @@ export default {
     let type = JSON.parse(this.el.dataset.type)
     let max = JSON.parse(this.el.dataset.max)
     let min = JSON.parse(this.el.dataset.min)
+    let maxTime = JSON.parse(this.el.dataset.maxtime)
+    let minTime = JSON.parse(this.el.dataset.mintime)
     let title = JSON.parse(this.el.dataset.title)
 
     const ctx = this.el
@@ -73,16 +75,18 @@ export default {
             ticks: {
               display: true,
               autoSkip: false
-            }
+            },
+            min: minTime,
+            max: maxTime
           },
           y: {
             offset: true,
             grid: {
               color: "rgba(63 63 70)"
             },
             type: "linear",
-            min: 0
-            // max: max
+            min: min,
+            max: max
           }
         },
         responsive: true,

lib/nerves_hub_web/components/device_page/health_tab.ex

@@ -192,6 +192,8 @@ defmodule NervesHubWeb.Components.DevicePage.HealthTab do
                 data-unit={Jason.encode!(chart.unit)}
                 data-max={Jason.encode!(chart.max)}
                 data-min={Jason.encode!(chart.min)}
+                data-maxtime={Jason.encode!(chart.max_time)}
+                data-mintime={Jason.encode!(chart.min_time)}
                 data-metrics={Jason.encode!(chart.data)}
                 data-title={Jason.encode!(chart_title(chart))}
               >
@@ -271,8 +273,21 @@ defmodule NervesHubWeb.Components.DevicePage.HealthTab do
   end
 
   defp create_chart_data(device_id, {unit, _} = time_frame, memory_size) do
-    device_id
-    |> Metrics.get_device_metrics(time_frame)
+    metrics =
+      device_id
+      |> Metrics.get_device_metrics(time_frame)
+
+    %{inserted_at: max_time} =
+      Enum.max_by(metrics, & &1.inserted_at, DateTime, fn ->
+        %{inserted_at: DateTime.from_unix!(0)}
+      end)
+
+    %{inserted_at: min_time} =
+      Enum.min_by(metrics, & &1.inserted_at, DateTime, fn ->
+        %{inserted_at: DateTime.from_unix!(1)}
+      end)
+
+    metrics
     |> Enum.group_by(& &1.key)
     |> filter_and_sort()
     |> Enum.map(fn {type, metrics} ->
@@ -284,7 +299,9 @@ defmodule NervesHubWeb.Components.DevicePage.HealthTab do
         title: title(type),
         data: data,
         max: get_max_value(type, data, memory_size),
-        min: get_min_value(data),
+        min: get_min_value(type, data),
+        min_time: min_time,
+        max_time: max_time,
         unit: get_time_unit(time_frame)
       }
     end)
@@ -359,6 +376,8 @@ defmodule NervesHubWeb.Components.DevicePage.HealthTab do
         data
         |> Enum.max_by(& &1.y)
         |> Map.get(:y)
+        # Space it out a little
+        |> Kernel.+(1.0)
     end
   end
 
@@ -370,10 +389,28 @@ defmodule NervesHubWeb.Components.DevicePage.HealthTab do
     |> max(1)
   end
 
-  defp get_min_value(data) do
-    data
-    |> Enum.min_by(& &1.y)
-    |> Map.get(:y)
+  defp get_min_value(type, data) do
+    case type do
+      "load_" <> _ ->
+        0
+
+      type
+      when type in [
+             "mem_used_mb",
+             "mem_used_percent",
+             "cpu_temp",
+             "cpu_usage_percent",
+             "disk_used_percentage"
+           ] ->
+        0
+
+      _ ->
+        data
+        |> Enum.min_by(& &1.y)
+        |> Map.get(:y)
+        # Space it out a little
+        |> Kernel.-(1.0)
+    end
   end
 
   defp custom_metrics(metrics) do