Tweaked graph colors for readability

The influence shading colors of the graph have been changed as suggested by Papa Capricorn. These color values are also now exposed as graphStyle parameters.
matt-kimball · Jun 18, 2018 · 79dda74 · 79dda74
1 parent 9298784
commit 79dda74
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 12 deletions.
diff --git a/epc-graph.js b/epc-graph.js
@@ -357,20 +357,20 @@ function drawPowerGraph(
         ctx.save();
         /*  Color the curve according to influence type  */
         if (influence.fire > 0) {
-            solidColor = "rgb(163, 12, 14)";
-            translucentColor = "rgba(163, 12, 14, 0.33)";
+            solidColor = graphStyle.fireColorSolid;
+            translucentColor = graphStyle.fireColorTranslucent;
         } else if (influence.time > 0) {
-            solidColor = "rgb(178, 111, 3)";
-            translucentColor = "rgba(178, 111, 3, 0.33)";
+            solidColor = graphStyle.timeColorSolid;
+            translucentColor = graphStyle.timeColorTranslucent;
         } else if (influence.justice > 0) {
-            solidColor = "rgb(58, 103, 39)";
-            translucentColor = "rgba(58, 103, 39, 0.33)";
+            solidColor = graphStyle.justiceColorSolid;
+            translucentColor = graphStyle.justiceColorTranslucent;
         } else if (influence.primal > 0) {
-            solidColor = "rgb(3, 50, 118)";
-            translucentColor = "rgba(3, 50, 118, 0.33)";
+            solidColor = graphStyle.primalColorSolid;
+            translucentColor = graphStyle.primalColorTranslucent;
         } else if (influence.shadow > 0) {
-            solidColor = "rgb(51, 23, 69)";
-            translucentColor = "rgba(51, 23, 69, 0.33)";
+            solidColor = graphStyle.shadowColorSolid;
+            translucentColor = graphStyle.shadowColorTranslucent;
         }
 
         ctx.strokeStyle = solidColor;

diff --git a/index.html b/index.html
@@ -1387,8 +1387,19 @@
             font: "'Open Sans Condensed Bold', sans-serif",
             textColor: "rgb(231, 228, 230)",
             borderColor: "rgb(192, 192, 192)",
-            backgroundColor: "rgb(0, 0, 0)",
-            interiorLineColor: "rgb(67, 67, 67)"
+            backgroundColor: "rgb(23, 20, 29)",
+            interiorLineColor: "rgb(67, 67, 67)",
+
+            fireColorSolid: "rgb(204, 0, 0)",
+            fireColorTranslucent: "rgba(204, 0, 0, 0.3)",
+            timeColorSolid: "rgb(241, 194, 50)",
+            timeColorTranslucent: "rgba(241, 194, 50, 0.3)",
+            justiceColorSolid: "rgb(106, 168, 79)",
+            justiceColorTranslucent: "rgba(106, 168, 79, 0.3)",
+            primalColorSolid: "rgb(60, 120, 216)",
+            primalColorTranslucent: "rgba(60, 120, 216, 0.3)",
+            shadowColorSolid: "rgb(166, 77, 121)",
+            shadowColorTranslucent: "rgba(166, 77, 121, 0.3)"
         };
 
         buildEpcUI(graphStyle);