Move to Chart.js

package.json

@@ -33,6 +33,9 @@
   "devDependencies": {
     "ejs": "3.1.10",
     "fs-extra": "11.2.0",
+    "chart.js": "4.4.6",
+    "chartjs-adapter-date-fns": "3.0.0",
+    "chartjs-plugin-zoom": "2.2.0",
     "highcharts": "11.4.8",
     "node-fetch": "3.3.2",
     "recursive-readdir": "2.2.3",

src/js/colors.js

@@ -3,7 +3,11 @@ const RGBA = [
   `rgba(4, 199, 253, ${OPACITY})`,
   `rgba(166, 42, 164, ${OPACITY})`,
   `rgba(18, 174, 248, ${OPACITY})`,
-  `rgba(132, 36, 134, ${OPACITY})`
+  `rgba(132, 36, 134, ${OPACITY})`,
+  `rgba(4, 199, 253, 0.1)`,
+  `rgba(166, 42, 164, 0.1)`,
+  `rgba(18, 174, 248, 0.1)`,
+  `rgba(132, 36, 134, 0.1)`
 ];
 const HEX = ['#04c7fd', '#a62aa4', '#12aef8', '#842486'];
 
@@ -25,6 +29,14 @@ export class Colors {
     return HEX[1];
   }
 
+  static get DESKTOP_DIM() {
+    return RGBA[4];
+  }
+
+  static get MOBILE_DIM() {
+    return RGBA[5];
+  }
+
   static get WEBPAGETEST() {
     return '#000000';
   }