Add linear regression to temporal graphs

frontend/src/lib/components/Energy/Aggregated/AggregatedFoodTable.svelte

@@ -3,6 +3,7 @@
 	import AggregatedFoodComp from "$lib/components/Energy/Aggregated/AggregatedFoodComp.svelte";
 	import { main } from "$wails/models";
 	import type { ChartData, Point } from "chart.js";
+	import regression from "regression";
 	import {
 		CategoryScale,
 		Chart as ChartJS,
@@ -13,6 +14,7 @@
 		Title,
 		Tooltip,
 	} from "chart.js";
+	import { CalculateR2 } from "$lib/utils";
 
 	ChartJS.register(Title, Tooltip, Legend, LineElement, LinearScale, PointElement, CategoryScale);
 
@@ -32,7 +34,7 @@
 		pointHoverBorderColor: "rgba(220, 220, 220, 1)",
 		pointHoverBorderWidth: 2,
 		pointRadius: 1,
-		pointHitRadius: 10,
+		pointHitRadius: 20,
 	};
 	const data: ChartData<"line", (number | Point)[]> = {
 		labels: reversedItems.map((f) => f.period),
@@ -74,6 +76,14 @@
 			},
 		],
 	};
+	data.datasets.push({
+		...defaultOptions,
+		label: "R2",
+		data: CalculateR2(reversedItems.map((f, i) => [i, f.energy])),
+		borderColor: "#04d1d1",
+		pointBorderColor: "#04d1d1",
+		pointRadius: 0,
+	});
 </script>
 
 <template>

frontend/src/lib/components/Weight/Aggregated/AggregatedWeightTable.svelte

@@ -13,6 +13,7 @@
 		Title,
 		Tooltip,
 	} from "chart.js";
+	import { CalculateR2 } from "$lib/utils";
 
 	ChartJS.register(Title, Tooltip, Legend, LineElement, LinearScale, PointElement, CategoryScale);
 
@@ -44,6 +45,14 @@
 			},
 		],
 	};
+	data.datasets.push({
+		...defaultOptions,
+		label: "R2",
+		data: CalculateR2(reversedItems.map((f, i) => [i, f.amount])),
+		borderColor: "#04d1d1",
+		pointBorderColor: "#04d1d1",
+		pointRadius: 0,
+	});
 </script>
 
 <template>

frontend/src/lib/utils.ts

@@ -1,5 +1,7 @@
 import { cubicOut } from "svelte/easing";
 import type { TransitionConfig } from "svelte/transition";
+import regression from "regression";
+import type { ChartData, Point } from "chart.js";
 
 type FlyAndScaleParams = {
 	y?: number;
@@ -109,5 +111,10 @@ function LerpColor(color1: Color, color2: Color, t: number): Color {
 	return { h, s, l };
 }
 
-export { GenerateColor, LerpColor, RemoveExistingColors };
+function CalculateR2(input: [number, number][]): number[] {
+	const reg = regression.linear(input);
+	return reg.points.map((point: [number, number]) => point[1]);
+}
+
+export { GenerateColor, LerpColor, RemoveExistingColors, CalculateR2 };
 export type { Color };