Merge pull request #1846 from concord-consortium/CODAP-20-Hover-date-precision-v3

Data tips respect date and numeric precision

Author: bfinzer

v3/src/components/data-display/models/data-display-content-model.ts

@@ -5,6 +5,9 @@
 import {comparer, reaction} from "mobx"
 import {addDisposer, Instance, types} from "mobx-state-tree"
 import { format } from "d3"
+import { formatDate } from "../../../utilities/date-utils"
+import { IValueType } from "../../../models/data/attribute-types"
+import { IAttribute } from "../../../models/data/attribute"
 import {IDataSet} from "../../../models/data/data-set"
 import {ISharedCaseMetadata} from "../../../models/shared/shared-case-metadata"
 import {ISharedDataSet} from "../../../models/shared/shared-data-set"
@@ -68,14 +71,39 @@ export const DataDisplayContentModel = TileContentModel
       return getTileContentInfo(self.type)?.getFormulaAdapters?.(self) ?? []
     },
     caseTipText(attributeIDs: string[], caseID: string, dataset?: IDataSet) {
+
+      const getValueToDisplay = (numValue: number | undefined, value: IValueType, attribute?: IAttribute) => {
+        if (!attribute) return ''
+        switch (attribute.type) {
+          case 'numeric': {
+            const numPrecision = attribute.numPrecision
+            const showUnits = attribute.units && attribute.units !== ""
+            const unitsString = showUnits ? ` ${attribute.units}` : ""
+            if (numValue && isFinite(numValue) && numPrecision) {
+              const formatStr = `.${attribute.numPrecision}~f`
+              const formatter = format(formatStr)
+              return `${formatter ? `${formatter(numValue)}` : `${numValue}`}${unitsString}`
+            }
+            return `${value}${unitsString}`
+          }
+          case 'date': {
+            const datePrecision = attribute.datePrecision
+            return value && datePrecision ? formatDate(String(value), datePrecision) : value
+          }
+          default:
+            return value
+        }
+      }
+
       const float = format('.3~f')
       const attrArray = (attributeIDs?.map(attrID => {
         const attribute = dataset?.attrFromID(attrID),
           name = attribute?.name,
           numValue = dataset?.getNumeric(caseID, attrID),
           value = numValue != null && isFinite(numValue) ? float(numValue)
-            : dataset?.getValue(caseID, attrID)
-        return value ? `${name}: ${value}` : ''
+            : dataset?.getValue(caseID, attrID),
+          displayedValue = getValueToDisplay(numValue, value, attribute)
+        return value ? `${name}: ${displayedValue}` : ''
       }))
       // Caption attribute can also be one of the plotted attributes, so we remove dups and join into html string
       return Array.from(new Set(attrArray)).filter(anEntry => anEntry !== '').join('<br>')

v3/src/utilities/js-utils.ts

@@ -170,8 +170,9 @@ export function hashStringSet(strings: string[]) {
 export function hashStringSets(stringSets: Array<string[]>) {
   return stringSets
     .map(hashStringSet)
+    // XOR all individual hashes with an index-based multiplier and a large initial value
     // eslint-disable-next-line no-bitwise
-    .reduce((acc, hash, index) => acc ^ (hash * (index + 1)), 0x9e3779b9) // XOR all individual hashes with an index-based multiplier and a large initial value
+    .reduce((acc, hash, index) => acc ^ (hash * (index + 1)), 0x9e3779b9)
 }
 
 /*