@macrostrat/column-views 3.12.1 → 3.13.0

package/src/prepare-units/composite-scale.ts

@@ -4,7 +4,6 @@ import { ScaleContinuousNumeric, scaleLinear } from "d3-scale";
 import { UnitLong } from "@macrostrat/api-types";
 import { buildHybridScale } from "./dynamic-scales";
 import { sectionDensity } from "./density";
-import { ExtUnit, HybridScaleType, SectionInfo } from "./types";
 import type {
   ColumnScaleOptions,
   CompositeColumnData,
@@ -14,6 +13,8 @@ import type {
   PackageScaleLayoutData,
   SectionScaleOptions,
 } from "./types";
+import { ExtUnit, HybridScaleType, SectionInfo } from "./types";
+import { mergeAgeRanges, MergeMode } from "@macrostrat/stratigraphy-utils";
 
 // Composite scale information augmented with units in each package
 
@@ -144,7 +145,13 @@ function buildSectionScale<T extends UnitLong>(
   } = opts;
   const domain = opts.domain ?? findSectionHeightRange(data, axisType);
 
-  const dAge = Math.abs(domain[0] - domain[1]);
+  const dAge = dx(domain);
+  let visibleExtent = dAge; // full section is visible
+  if (visibleWindow != null) {
+    visibleExtent = dx(
+      mergeAgeRanges([domain, visibleWindow], MergeMode.Inner),
+    );
+  }
 
   let _pixelScale: any = opts.pixelScale;
   let pixelHeight: number;
@@ -177,6 +184,7 @@ function buildSectionScale<T extends UnitLong>(
      * is what it's for, and never a sliver the window happens to cut. */
     _pixelScale = sectionDensity(opts)({
       extent: dAge,
+      visibleExtent,
       unitExtents: visibleUnitExtents(data, axisType, visibleWindow),
       units: data,
       sectionID,
@@ -194,6 +202,10 @@ function buildSectionScale<T extends UnitLong>(
   );
 }
 
+function dx(range: [number, number]) {
+  return Math.abs(range[0] - range[1]);
+}
+
 /**
  * The density each section will actually render at once the window is applied.
  *
@@ -275,9 +287,12 @@ function spendOutward<T extends UnitLong>(
   // Sections ordered outward from the edge, keeping only what lies beyond it.
   const beyond = sections
     .filter(
-      (s) => direction * (s.b_age - edge) > 0 || direction * (s.t_age - edge) > 0,
+      (s) =>
+        direction * (s.b_age - edge) > 0 || direction * (s.t_age - edge) > 0,
     )
-    .sort((a, b) => direction * (nearEdge(a, direction) - nearEdge(b, direction)));
+    .sort(
+      (a, b) => direction * (nearEdge(a, direction) - nearEdge(b, direction)),
+    );
 
   let bound = edge;
   let budget = padding;
@@ -290,7 +305,8 @@ function spendOutward<T extends UnitLong>(
       direction > 0
         ? Math.max(section.t_age, bound)
         : Math.min(section.b_age, bound);
-    const available = direction > 0 ? section.b_age - from : from - section.t_age;
+    const available =
+      direction > 0 ? section.b_age - from : from - section.t_age;
     if (available <= 0) continue;
 
     const cost = available * pixelScale;
@@ -451,10 +467,7 @@ function visibleUnitExtents(
         const [b_pos, t_pos] = getUnitHeightRange(d, axisType);
         if (!clip) return Math.abs(b_pos - t_pos);
         const [b_win, t_win] = visibleWindow;
-        return Math.max(
-          0,
-          Math.min(b_pos, b_win) - Math.max(t_pos, t_win),
-        );
+        return Math.max(0, Math.min(b_pos, b_win) - Math.max(t_pos, t_win));
       })
       .filter((d) => d > 0);
 

package/src/prepare-units/density.ts

@@ -12,6 +12,8 @@ import type { UnitLong } from "@macrostrat/api-types";
 export interface SectionDensityContext {
   /** The section's extent, in axis units */
   extent: number;
+  /** The section's shown extent, in axis units */
+  visibleExtent: number;
   /** Extents of the units the render window actually shows, each clipped to
    * it. Measuring what's on screen is what makes a unit-height rule mean the
    * same thing at every zoom depth. */
@@ -28,23 +30,14 @@ export type SectionDensity = (ctx: SectionDensityContext) => number;
 
 export type SectionDensityLike = number | SectionDensity;
 
-/** Room for a typical unit on screen: `px` tall, whatever its duration.
- *
- * "Typical" is the median of the visible extents, which is the only summary
- * that survives both tails. Unit durations are spread over orders of
- * magnitude: the arithmetic mean sits above any unit you would point at, so a
- * couple of long ones squeeze everything else below the target — and the
- * geometric mean fails the other way, since a single hair-thin unit (a
- * Holocene sliver beside a Pliocene terrace, say) drags the log-average down
- * and stretches the whole section to give that sliver its 20 pixels.
- */
-export function unitHeight(px: number): SectionDensity {
-  return (ctx) => px / typicalExtent(ctx.unitExtents);
+enum UnitHeightMode {
+  MEDIAN = "median",
+  MEAN = "mean",
 }
 
 /** Room for the section: `px` tall, whatever its extent. */
 export function sectionHeight(px: number): SectionDensity {
-  return (ctx) => px / ctx.extent;
+  return (ctx) => px / ctx.visibleExtent;
 }
 
 /** A density stated outright, in pixels per axis unit. */
@@ -75,15 +68,6 @@ export function resolveDensity(
   return rule(ctx);
 }
 
-function typicalExtent(extents: number[]): number {
-  const sorted = extents.filter((d) => d > 0).sort((a, b) => a - b);
-  if (sorted.length === 0) return NaN;
-  const mid = (sorted.length - 1) / 2;
-  const lower = Math.floor(mid);
-  const upper = Math.ceil(mid);
-  return (sorted[lower] + sorted[upper]) / 2;
-}
-
 /** Mirrors the default in `sectionDensity` */
 export const DEFAULT_TARGET_UNIT_HEIGHT = 20;
 /** Small sections often have a unit or two, and no room for axis labels */
@@ -131,8 +115,7 @@ export interface SectionSizeOptions {
  * holds. What it returns overrides the column-wide options for that section;
  * anything it leaves out keeps the column's value. */
 export type SectionOptionsLike =
-  | SectionSizeOptions
-  | ((ctx: SectionDensityContext) => SectionSizeOptions);
+  SectionSizeOptions | ((ctx: SectionDensityContext) => SectionSizeOptions);
 
 export interface SectionDensityOptions extends SectionSizeOptions {
   /** Sizing decided per section */
@@ -164,7 +147,7 @@ function densityRule(opts: SectionSizeOptions): SectionDensity {
   } = opts;
 
   const derived = atLeast(
-    unitHeight(targetUnitHeight),
+    unitHeight(targetUnitHeight, UnitHeightMode.MEAN),
     fixedDensity(minPixelScale),
     sectionHeight(minSectionHeight ?? targetUnitHeight ?? 0),
   );
@@ -182,6 +165,34 @@ function densityRule(opts: SectionSizeOptions): SectionDensity {
   };
 }
 
+/** Room for a typical unit on screen: `px` tall, whatever its duration.
+ *
+ * "Typical" is the median of the visible extents, which is the only summary
+ * that survives both tails. Unit durations are spread over orders of
+ * magnitude: the arithmetic mean sits above any unit you would point at, so a
+ * couple of long ones squeeze everything else below the target — and the
+ * geometric mean fails the other way, since a single hair-thin unit (a
+ * Holocene sliver beside a Pliocene terrace, say) drags the log-average down
+ * and stretches the whole section to give that sliver its 20 pixels.
+ */
+export function unitHeight(px: number, mode: UnitHeightMode): SectionDensity {
+  return (ctx) => px / typicalExtent(ctx.unitExtents, mode);
+}
+
+function typicalExtent(extents: number[], mode: UnitHeightMode): number {
+  /** The typical extent for a unit, the median of its extents. */
+  const filtered = extents.filter((d) => d > 0);
+  if (filtered.length === 0) return NaN;
+  if (mode === UnitHeightMode.MEAN) {
+    return filtered.reduce((sum, val) => sum + val, 0) / filtered.length;
+  }
+  const sorted = filtered.sort((a, b) => a - b);
+  const mid = (sorted.length - 1) / 2;
+  const lower = Math.floor(mid);
+  const upper = Math.ceil(mid);
+  return (sorted[lower] + sorted[upper]) / 2;
+}
+
 /** The density this axis was given, if any. The axis-specific spellings win
  * over the generic one, which is what lets both be held while the axis
  * changes. */

package/src/prepare-units/helpers.ts

@@ -282,7 +282,7 @@ export function groupUnitsIntoSectionsByOverlap<T extends BaseUnit>(
     }
   }
 
-  return finalSectionList.map((section, i) => {
+  const s1 = finalSectionList.map((section, i) => {
     const [b_age, t_age] = getSectionAgeRange(section.units);
     const [b_pos, t_pos] = getSectionPosRange(section.units, axisType);
     return {
@@ -295,6 +295,8 @@ export function groupUnitsIntoSectionsByOverlap<T extends BaseUnit>(
       units: section.units as T[],
     };
   });
+
+  return sortUnits(s1, axisType);
 }
 
 export function getSectionPosRange(
@@ -338,6 +340,38 @@ export function getSectionAgeRange(units: BaseUnit[]): [number, number] {
   return getSectionPosRange(units, ColumnAxisType.AGE);
 }
 
+function forEachSection(fn, sections, ...args) {
+  return sections.map((section) => {
+    return {
+      ...section,
+      units: fn(section.units, ...args),
+    };
+  });
+}
+
+function sortUnits(units: BaseUnit[], axisType: ColumnAxisType) {
+  return units.sort((a, b) => {
+    if (
+      axisType === ColumnAxisType.HEIGHT &&
+      b.t_pos !== undefined &&
+      a.t_pos !== undefined
+    ) {
+      return b.t_pos - a.t_pos;
+    }
+    if (
+      axisType === ColumnAxisType.DEPTH &&
+      b.t_pos !== undefined &&
+      a.t_pos !== undefined
+    ) {
+      return a.t_pos - b.t_pos;
+    }
+    if (axisType === ColumnAxisType.AGE) {
+      return a.t_age - b.t_age;
+    }
+    return 0;
+  });
+}
+
 export function mergeOverlappingSections<T extends UnitLong>(
   sections: SectionInfo<T>[],
 ): SectionInfo<T>[] {

package/src/prepare-units/index.ts

@@ -228,7 +228,6 @@ export function prepareColumnUnits(
     const natural = (section) =>
       scales.get(section) ?? section.scaleInfo.pixelScale;
 
-
     const scaleFor = natural;
 
     const window =

package/src/unit-details/panel.ts

@@ -406,7 +406,8 @@ export function ThicknessField({ unit, label = "Thickness" }) {
 }
 
 function BibInfo({ refs }) {
-  const refData = useMacrostratData("refs", refs);
+  // A reference the server doesn't know comes back as a hole, not a record
+  const refData = useMacrostratData("refs", refs)?.filter((d) => d != null);
 
   if (refData == null || refData.length === 0) {
     return null;