Merge pull request #1836 from nextstrain/james/yyyy-mm-dd-scatterplots

Scatterplots work with temporal YYYY-MM-DD scales
nextstrain · Aug 29, 2024 · 35a0fa1 · 35a0fa1
2 parents a045771 + f5e388e
commit 35a0fa1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/components/tree/phyloTree/layouts.js b/src/components/tree/phyloTree/layouts.js
@@ -6,6 +6,7 @@ import {point as scalePoint} from "d3-scale/src/band";
 import { timerStart, timerEnd } from "../../../util/perf";
 import { getTraitFromNode, getDivFromNode } from "../../../util/treeMiscHelpers";
 import { stemParent, nodeOrdering } from "./helpers";
+import { numDate } from "../../../util/colorHelpers";
 
 /**
  * assigns the attribute this.layout and calls the function that
@@ -96,6 +97,9 @@ export const scatterplotLayout = function scatterplotLayout() {
     } else {
       d.x = getTraitFromNode(d.n, this.scatterVariables.x);
       d.px = getTraitFromNode(stemParent(d.n), this.scatterVariables.x);
+      if (this.scatterVariables.xTemporal) {
+        [d.x, d.px] = [numDate(d.x, true), numDate(d.px, true)]
+      }
     }
     // set y and parent  values
     if (this.scatterVariables.y==="div") {
@@ -109,6 +113,9 @@ export const scatterplotLayout = function scatterplotLayout() {
     } else {
       d.y = getTraitFromNode(d.n, this.scatterVariables.y);
       d.py = getTraitFromNode(stemParent(d.n), this.scatterVariables.y);
+      if (this.scatterVariables.yTemporal) {
+        [d.y, d.py] = [numDate(d.y, true), numDate(d.py, true)]
+      }
     }
   });
 

diff --git a/src/util/scatterplotHelpers.js b/src/util/scatterplotHelpers.js
@@ -98,9 +98,12 @@ export function getFirstMatchingScatterVariable(options, tryTheseFirst, notThisV
 export function addScatterAxisInfo(scatterVariables, axis, controls, tree, metadata) {
   const axisVar = scatterVariables[axis];
   const knownContinuousKeys = ["div", "num_date", "displayOrder"];
-  if (knownContinuousKeys.includes(axisVar) || metadata.colorings[axisVar].type==="continuous") {
+  if (knownContinuousKeys.includes(axisVar) || metadata.colorings[axisVar].type==="continuous" ||
+    metadata.colorings[axisVar].type==="temporal")
+  {
     scatterVariables[`${axis}Continuous`] = true;
     scatterVariables[`${axis}Domain`] = undefined;
+    scatterVariables[`${axis}Temporal`] = metadata.colorings[axisVar]?.type==="temporal";
     return scatterVariables;
   }
   const trait = scatterVariables[axis]==="gt" ? controls.colorBy : scatterVariables[axis];
@@ -109,12 +112,14 @@ export function addScatterAxisInfo(scatterVariables, axis, controls, tree, metad
 }
 
 export function addScatterAxisGivenColorScale(scatterVariables, colorScale, axis) {
-  if (colorScale.scaleType==="continuous") {
+  if (colorScale.scaleType==="continuous" || colorScale.scaleType==="temporal") {
     scatterVariables[`${axis}Continuous`] = true;
     scatterVariables[`${axis}Domain`] = undefined;
+    scatterVariables[`${axis}Temporal`] = colorScale.scaleType==="temporal";
     return scatterVariables;
   }
   scatterVariables[`${axis}Continuous`] = false;
   scatterVariables[`${axis}Domain`] = colorScale.domain.slice();
+  scatterVariables[`${axis}Temporal`] = false;
   return scatterVariables;
 }