Merge pull request #1610 from concord-consortium/188539688-graph-resp…

…onse-to-hierarchy-bug-v3

Bug where split dot plot messes up when hierarchy changes

v3/src/components/axis/hooks/use-sub-axis.ts

@@ -322,6 +322,7 @@ export const useSubAxis = ({
       setupCategories()
     } else if (isBaseNumericAxisModel(axisModel)) {
       const currentAxisDomain = axisModel.domain
+      const multiScale = layout.getAxisMultiScale(axisPlace)
       const allowToShrink = axisModel.allowRangeToShrink
       const numericValues = dataConfig?.numericValuesForAttrRole(role) ?? []
       const [minValue, maxValue] = extent(numericValues, d => d) as [number, number]
@@ -330,9 +331,8 @@ export const useSubAxis = ({
         niceBounds.min = Math.min(niceBounds.min, currentAxisDomain[0])
         niceBounds.max = Math.max(niceBounds.max, currentAxisDomain[1])
       }
-      if (niceBounds.min === currentAxisDomain[0] && niceBounds.max === currentAxisDomain[1]) return
-      layout.getAxisMultiScale(axisPlace)?.setNumericDomain([niceBounds.min, niceBounds.max])
-      isBaseNumericAxisModel(axisModel) && setNiceDomain(numericValues, axisModel)
+      multiScale?.setNumericDomain([niceBounds.min, niceBounds.max])
+      setNiceDomain(numericValues, axisModel)
     }
     renderSubAxis()
   }, [axisModel, axisPlace, dataConfig, layout, renderSubAxis, setupCategories])

v3/src/components/axis/models/multi-scale.ts

@@ -155,8 +155,10 @@ export class MultiScale {
   }
 
   @action setNumericDomain(domain: Iterable<NumberValue>) {
-    this.numericDomain = domain as AxisExtent
-    this.numericScale?.domain(domain)
+    const newDomain = domain as AxisExtent
+    if (!isFinite(newDomain[0]) || !isFinite(newDomain[1])) return
+    this.numericDomain = newDomain
+    this.numericScale?.domain(newDomain)
   }
 
   @action setCategoricalDomain(domain: Iterable<string>) {

v3/src/components/graph/components/graph.tsx

@@ -28,7 +28,7 @@ import {GraphDataConfigurationContext} from "../hooks/use-graph-data-configurati
 import {useGraphLayoutContext} from "../hooks/use-graph-layout-context"
 import {useGraphModel} from "../hooks/use-graph-model"
 import {setNiceDomain} from "../utilities/graph-utils"
-import { EmptyAxisModel, IAxisModel, isNumericAxisModel } from "../../axis/models/axis-model"
+import { EmptyAxisModel, IBaseNumericAxisModel, isNumericAxisModel } from "../../axis/models/axis-model"
 import {GraphPlace} from "../../axis-graph-shared"
 import {MarqueeState} from "../../data-display/models/marquee-state"
 import {DataTip} from "../../data-display/components/data-tip"
@@ -209,7 +209,7 @@ export const Graph = observer(function Graph({graphController, graphRef, pixiPoi
   const handleRemoveAttribute = useCallback((place: GraphPlace, idOfAttributeToRemove: string) => {
     if (place === 'left' && (graphModel.dataConfiguration.yAttributeDescriptions.length ?? 0) > 1) {
       graphModel.dataConfiguration.removeYAttributeWithID(idOfAttributeToRemove)
-      const yAxisModel = graphModel.getAxis('left') as IAxisModel
+      const yAxisModel = graphModel.getAxis('left') as IBaseNumericAxisModel
       const yValues = graphModel.dataConfiguration.numericValuesForAttrRole('y') ?? []
       setNiceDomain(yValues, yAxisModel, graphModel.axisDomainOptions)
     } else {

v3/src/components/graph/utilities/graph-utils.ts

@@ -5,7 +5,7 @@ import {IPixiPointMetadata, PixiPoints} from "../../data-display/pixi/pixi-point
 import {IDataSet} from "../../../models/data/data-set"
 import {CaseData} from "../../data-display/d3-types"
 import {Point, PointDisplayType, transitionDuration} from "../../data-display/data-display-types"
-import { IAxisModel, isDateAxisModel, isNumericAxisModel } from "../../axis/models/axis-model"
+import {IAxisModel, IBaseNumericAxisModel, isDateAxisModel, isNumericAxisModel} from "../../axis/models/axis-model"
 import {ScaleNumericBaseType} from "../../axis/axis-types"
 import {defaultSelectedColor, defaultSelectedStroke, defaultSelectedStrokeWidth, defaultStrokeWidth}
   from "../../../utilities/color-utils"
@@ -53,7 +53,8 @@ export function computeNiceNumericBounds(min: number, max: number): { min: numbe
   return bounds
 }
 
-export function setNiceDomain(values: number[], axisModel: IAxisModel, options?: IDomainOptions) {
+export function setNiceDomain(values: number[], axisModel: IBaseNumericAxisModel, options?: IDomainOptions) {
+  if (values.length === 0) return // leave things as they are
   if (isNumericAxisModel(axisModel)) {
     const [minValue, maxValue] = extent(values, d => d) as [number, number]
     let {min: niceMin, max: niceMax} = computeNiceNumericBounds(minValue, maxValue)