include zero year in line charts to ensure at least two points

Recidiviz · Nov 10, 2020 · a90ac74 · a90ac74
1 parent 1df087e
commit a90ac74
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 6 deletions.
diff --git a/public-dashboard-client/src/viz-recidivism-rates/RecidivismRatesChart.js b/public-dashboard-client/src/viz-recidivism-rates/RecidivismRatesChart.js
@@ -105,15 +105,15 @@ export default function RecidivismRatesChart({ data, highlightedCohort }) {
               lines={data}
               margin={MARGIN}
               otherChartProps={{
-                xExtent: [1, 10],
+                xExtent: [0, 10],
               }}
               size={[width, 475]}
               tooltipControllerProps={{
                 getTooltipProps: (d) => {
                   const currentPeriod = d.followupYears;
                   return {
                     title: `${currentPeriod} year${
-                      currentPeriod > 1 ? "s" : ""
+                      currentPeriod === 1 ? "" : "s"
                     } since release`,
                     records: d.points
                       .filter((p) => p.data.followupYears === currentPeriod)

diff --git a/public-dashboard-client/src/viz-recidivism-rates/VizRecidivismRates.js b/public-dashboard-client/src/viz-recidivism-rates/VizRecidivismRates.js
@@ -31,6 +31,21 @@ import {
 } from "../utils";
 import RecidivismRatesChart from "./RecidivismRatesChart";
 
+/**
+ * adds an initial record to each series for year zero with rate zero.
+ * Helps to make the initial point in the line chart more visible,
+ * especially for lines that would otherwise only have one point.
+ */
+function prependZero(records) {
+  const zeroRecord = {
+    ...records[0],
+    followupYears: 0,
+    recidivated_releases: "0",
+    recidivismRate: 0,
+  };
+  return [zeroRecord, ...records];
+}
+
 /**
  * When multiple cohorts are selected, or a single cohort and the `total` dimension,
  * will return one data series per cohort.
@@ -54,11 +69,11 @@ function prepareChartData({ data, dimension, selectedCohorts }) {
         ),
         (d) => d[DIMENSION_DATA_KEYS[dimension]]
       ),
-      ([key, value]) => {
+      ([key, records]) => {
         return {
           key,
           label: DIMENSION_MAPPINGS.get(dimension).get(key),
-          coordinates: value,
+          coordinates: prependZero(records),
         };
       }
     )
@@ -68,11 +83,11 @@ function prepareChartData({ data, dimension, selectedCohorts }) {
   return (
     Array.from(
       group(filteredData, (d) => d.releaseCohort),
-      ([key, value]) => {
+      ([key, records]) => {
         return {
           key,
           label: key,
-          coordinates: value,
+          coordinates: prependZero(records),
         };
       }
     )