global: snapshot part 3

website/scripts/options/cointime.js

@@ -284,6 +284,7 @@ export function createCointimeSection() {
                 name,
                 color,
                 base: pattern.base,
+                average: pattern.average,
                 rolling: pattern.sum,
                 cumulative: pattern.cumulative,
               })),
@@ -335,6 +336,7 @@ export function createCointimeSection() {
                   name,
                   color,
                   base: pattern.base,
+                  average: pattern.average,
                   rolling: pattern.sum,
                   cumulative: pattern.cumulative,
                 })),
@@ -342,6 +344,7 @@ export function createCointimeSection() {
                   name: vocdd.name,
                   color: vocdd.color,
                   base: vocdd.pattern.base,
+                  average: vocdd.pattern.average,
                   rolling: vocdd.pattern.sum,
                   cumulative: vocdd.pattern.cumulative,
                 },

website/scripts/options/distribution/cost-basis.js

@@ -2,18 +2,16 @@
  * Cost Basis section builders
  *
  * Structure:
- * - Summary: Key stats (avg + median active, quartiles/extremes available)
- * - By Coin: BTC-weighted percentiles (IQR active: p25, p50, p75)
- * - By Capital: USD-weighted percentiles (IQR active: p25, p50, p75)
- * - Supply Density: Cost basis supply density percentage
+ * - Per Coin: sats-weighted (profitability + distribution)
+ * - Per Dollar: value-weighted (profitability + distribution)
+ * - Profitability: cross-cutting (per coin + per dollar on same chart)
+ * - Supply Density: cost basis supply density percentage
  *
  * Only for cohorts WITH costBasis (All, STH, LTH)
  */
 
 import { colors } from "../../utils/colors.js";
 import { entries } from "../../utils/array.js";
-import { Unit } from "../../utils/units.js";
-import { priceLines } from "../constants.js";
 import { price, percentRatio } from "../series.js";
 import { mapCohortsWithAll, flatMapCohortsWithAll } from "../shared.js";
 
@@ -24,7 +22,7 @@ const ACTIVE_PCTS = new Set(["pct75", "pct50", "pct25"]);
  * @param {(name: string) => string} [n]
  * @returns {FetchedPriceSeriesBlueprint[]}
  */
-function createCorePercentileSeries(p, n = (x) => x) {
+function percentileSeries(p, n = (x) => x) {
   return entries(p)
     .reverse()
     .map(([key, s], i, arr) =>
@@ -37,104 +35,46 @@ function createCorePercentileSeries(p, n = (x) => x) {
     );
 }
 
-/**
- * @param {CohortAll | CohortFull | CohortLongTerm} cohort
- * @returns {FetchedPriceSeriesBlueprint[]}
- */
-function createSingleSummarySeries(cohort) {
-  const { color, tree } = cohort;
-  const p = tree.costBasis.percentiles;
-  return [
-    price({ series: tree.realized.price, name: "Average", color }),
-    price({
-      series: tree.costBasis.max,
-      name: "Max (p100)",
-      color: colors.stat.max,
-      defaultActive: false,
-    }),
-    price({
-      series: p.pct75,
-      name: "Q3 (p75)",
-      color: colors.stat.pct75,
-      defaultActive: false,
-    }),
-    price({ series: p.pct50, name: "Median (p50)", color: colors.stat.median }),
-    price({
-      series: p.pct25,
-      name: "Q1 (p25)",
-      color: colors.stat.pct25,
-      defaultActive: false,
-    }),
-    price({
-      series: tree.costBasis.min,
-      name: "Min (p0)",
-      color: colors.stat.min,
-      defaultActive: false,
-    }),
-  ];
-}
+// ============================================================================
+// Single cohort helpers
+// ============================================================================
 
 /**
- * @param {readonly (CohortAll | CohortFull | CohortLongTerm)[]} list
- * @param {CohortAll} all
- * @returns {FetchedPriceSeriesBlueprint[]}
+ * Per Coin or Per Dollar folder for a single cohort
+ * @param {Object} args
+ * @param {AnyPricePattern} args.avgPrice - realized price (per coin) or investor price (per dollar)
+ * @param {string} args.avgName
+ * @param {AnyPricePattern} args.inProfit
+ * @param {AnyPricePattern} args.inLoss
+ * @param {PercentilesPattern} args.percentiles
+ * @param {Color} args.color
+ * @param {string} args.weightLabel
+ * @param {(name: string) => string} args.title
+ * @param {AnyPricePattern} [args.min]
+ * @param {AnyPricePattern} [args.max]
+ * @returns {PartialOptionsTree}
  */
-function createGroupedSummarySeries(list, all) {
-  return mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-    price({ series: tree.realized.price, name, color }),
-  );
-}
-
-/**
- * @param {CohortAll | CohortFull | CohortLongTerm} cohort
- * @returns {FetchedPriceSeriesBlueprint[]}
- */
-function createSingleByCoinSeries(cohort) {
-  const { color, tree } = cohort;
-  const cb = tree.costBasis;
+function singleWeightFolder({ avgPrice, avgName, inProfit, inLoss, percentiles, color, weightLabel, title, min, max }) {
   return [
-    price({ series: tree.realized.price, name: "Average", color }),
-    price({
-      series: cb.max,
-      name: "p100",
-      color: colors.stat.max,
-      defaultActive: false,
-    }),
-    ...createCorePercentileSeries(cb.percentiles),
-    price({
-      series: cb.min,
-      name: "p0",
-      color: colors.stat.min,
-      defaultActive: false,
-    }),
-  ];
-}
-
-/**
- * @param {CohortAll | CohortFull | CohortLongTerm} cohort
- * @returns {FetchedPriceSeriesBlueprint[]}
- */
-function createSingleByCapitalSeries(cohort) {
-  const { color, tree } = cohort;
-  return [
-    price({ series: tree.realized.investor.price, name: "Average", color }),
-    ...createCorePercentileSeries(tree.costBasis.investedCapital),
-  ];
-}
-
-/**
- * @param {CohortAll | CohortFull | CohortLongTerm} cohort
- * @returns {AnyFetchedSeriesBlueprint[]}
- */
-function createSingleSupplyDensitySeries(cohort) {
-  const { tree } = cohort;
-  return [
-    ...percentRatio({
-      pattern: tree.costBasis.supplyDensity,
-      name: "Supply Density",
-      color: colors.bitcoin,
-    }),
-    ...priceLines({ numbers: [100, 50, 0], unit: Unit.percentage }),
+    {
+      name: "Profitability",
+      title: title(`Cost Basis Profitability (${weightLabel})`),
+      top: [
+        price({ series: inProfit, name: "In Profit", color: colors.profit }),
+        price({ series: avgPrice, name: avgName, color }),
+        price({ series: inLoss, name: "In Loss", color: colors.loss }),
+      ],
+    },
+    {
+      name: "Distribution",
+      title: title(`Cost Basis Distribution (${weightLabel})`),
+      top: [
+        price({ series: avgPrice, name: avgName, color }),
+        ...(max ? [price({ series: max, name: "p100", color: colors.stat.max, defaultActive: false })] : []),
+        ...percentileSeries(percentiles),
+        ...(min ? [price({ series: min, name: "p0", color: colors.stat.min, defaultActive: false })] : []),
+      ],
+    },
   ];
 }
 
@@ -143,125 +83,171 @@ function createSingleSupplyDensitySeries(cohort) {
  * @returns {PartialOptionsGroup}
  */
 export function createCostBasisSectionWithPercentiles({ cohort, title }) {
+  const { tree, color } = cohort;
+  const cb = tree.costBasis;
   return {
     name: "Cost Basis",
     tree: [
       {
-        name: "Summary",
-        title: title("Cost Basis Summary"),
-        top: createSingleSummarySeries(cohort),
+        name: "Per Coin",
+        tree: singleWeightFolder({
+          avgPrice: tree.realized.price, avgName: "Average",
+          inProfit: cb.inProfit.perCoin, inLoss: cb.inLoss.perCoin,
+          percentiles: cb.percentiles, color, weightLabel: "BTC-weighted", title,
+          min: cb.min, max: cb.max,
+        }),
       },
       {
-        name: "By Coin",
-        title: title("Cost Basis Distribution (BTC-weighted)"),
-        top: createSingleByCoinSeries(cohort),
+        name: "Per Dollar",
+        tree: singleWeightFolder({
+          avgPrice: tree.realized.investor.price, avgName: "Average",
+          inProfit: cb.inProfit.perDollar, inLoss: cb.inLoss.perDollar,
+          percentiles: cb.investedCapital, color, weightLabel: "USD-weighted", title,
+        }),
       },
       {
-        name: "By Capital",
-        title: title("Cost Basis Distribution (USD-weighted)"),
-        top: createSingleByCapitalSeries(cohort),
+        name: "Profitability",
+        tree: [
+          {
+            name: "In Profit",
+            title: title("Cost Basis In Profit"),
+            top: [
+              price({ series: cb.inProfit.perCoin, name: "Per Coin", color: colors.realized }),
+              price({ series: cb.inProfit.perDollar, name: "Per Dollar", color: colors.investor }),
+            ],
+          },
+          {
+            name: "In Loss",
+            title: title("Cost Basis In Loss"),
+            top: [
+              price({ series: cb.inLoss.perCoin, name: "Per Coin", color: colors.realized }),
+              price({ series: cb.inLoss.perDollar, name: "Per Dollar", color: colors.investor }),
+            ],
+          },
+        ],
       },
       {
         name: "Supply Density",
         title: title("Cost Basis Supply Density"),
-        bottom: createSingleSupplyDensitySeries(cohort),
+        bottom: percentRatio({ pattern: cb.supplyDensity, name: "Supply Density", color: colors.bitcoin }),
       },
     ],
   };
 }
 
+// ============================================================================
+// Grouped cohort helpers
+// ============================================================================
+
+/**
+ * Per Coin or Per Dollar folder for grouped cohorts
+ * @param {Object} args
+ * @param {readonly (CohortAll | CohortFull | CohortLongTerm)[]} args.list
+ * @param {CohortAll} args.all
+ * @param {(c: CohortAll | CohortFull | CohortLongTerm) => AnyPricePattern} args.getAvgPrice
+ * @param {(c: CohortAll | CohortFull | CohortLongTerm) => AnyPricePattern} args.getInProfit
+ * @param {(c: CohortAll | CohortFull | CohortLongTerm) => AnyPricePattern} args.getInLoss
+ * @param {(c: CohortAll | CohortFull | CohortLongTerm) => PercentilesPattern} args.getPercentiles
+ * @param {string} args.avgTitle
+ * @param {string} args.weightLabel
+ * @param {(name: string) => string} args.title
+ * @returns {PartialOptionsTree}
+ */
+function groupedWeightFolder({ list, all, getAvgPrice, getInProfit, getInLoss, getPercentiles, avgTitle, weightLabel, title }) {
+  return [
+    {
+      name: "Profitability",
+      tree: [
+        {
+          name: "In Profit",
+          title: title(`Cost Basis In Profit (${weightLabel})`),
+          top: mapCohortsWithAll(list, all, (c) =>
+            price({ series: getInProfit(c), name: c.name, color: c.color }),
+          ),
+        },
+        {
+          name: "In Loss",
+          title: title(`Cost Basis In Loss (${weightLabel})`),
+          top: mapCohortsWithAll(list, all, (c) =>
+            price({ series: getInLoss(c), name: c.name, color: c.color }),
+          ),
+        },
+      ],
+    },
+    {
+      name: "Distribution",
+      tree: [
+        {
+          name: "Average",
+          title: title(`${avgTitle} Comparison`),
+          top: mapCohortsWithAll(list, all, (c) =>
+            price({ series: getAvgPrice(c), name: c.name, color: c.color }),
+          ),
+        },
+        ...(/** @type {const} */ ([
+          ["pct50", "Median"],
+          ["pct75", "Q3"],
+          ["pct25", "Q1"],
+        ])).map(([pct, label]) => ({
+          name: label,
+          title: title(`Cost Basis ${label} (${weightLabel})`),
+          top: mapCohortsWithAll(list, all, (c) =>
+            price({ series: getPercentiles(c)[pct], name: c.name, color: c.color }),
+          ),
+        })),
+      ],
+    },
+  ];
+}
+
 /**
  * @param {{ list: readonly (CohortAll | CohortFull | CohortLongTerm)[], all: CohortAll, title: (name: string) => string }} args
  * @returns {PartialOptionsGroup}
  */
-export function createGroupedCostBasisSectionWithPercentiles({
-  list,
-  all,
-  title,
-}) {
+export function createGroupedCostBasisSectionWithPercentiles({ list, all, title }) {
   return {
     name: "Cost Basis",
     tree: [
       {
-        name: "Summary",
-        title: title("Cost Basis Summary"),
-        top: createGroupedSummarySeries(list, all),
+        name: "Per Coin",
+        tree: groupedWeightFolder({
+          list, all, title,
+          getAvgPrice: (c) => c.tree.realized.price,
+          getInProfit: (c) => c.tree.costBasis.inProfit.perCoin,
+          getInLoss: (c) => c.tree.costBasis.inLoss.perCoin,
+          getPercentiles: (c) => c.tree.costBasis.percentiles,
+          avgTitle: "Average", weightLabel: "BTC-weighted",
+        }),
       },
       {
-        name: "By Coin",
-        tree: [
-          {
-            name: "Average",
-            title: title("Realized Price Comparison"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({ series: tree.realized.price, name, color }),
-            ),
-          },
-          {
-            name: "Median",
-            title: title("Cost Basis Median (BTC-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({ series: tree.costBasis.percentiles.pct50, name, color }),
-            ),
-          },
-          {
-            name: "Q3",
-            title: title("Cost Basis Q3 (BTC-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({ series: tree.costBasis.percentiles.pct75, name, color }),
-            ),
-          },
-          {
-            name: "Q1",
-            title: title("Cost Basis Q1 (BTC-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({ series: tree.costBasis.percentiles.pct25, name, color }),
-            ),
-          },
-        ],
+        name: "Per Dollar",
+        tree: groupedWeightFolder({
+          list, all, title,
+          getAvgPrice: (c) => c.tree.realized.investor.price,
+          getInProfit: (c) => c.tree.costBasis.inProfit.perDollar,
+          getInLoss: (c) => c.tree.costBasis.inLoss.perDollar,
+          getPercentiles: (c) => c.tree.costBasis.investedCapital,
+          avgTitle: "Average", weightLabel: "USD-weighted",
+        }),
       },
       {
-        name: "By Capital",
+        name: "Profitability",
         tree: [
           {
-            name: "Average",
-            title: title("Investor Price Comparison"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({ series: tree.realized.investor.price, name, color }),
-            ),
+            name: "In Profit",
+            title: title("Cost Basis In Profit"),
+            top: flatMapCohortsWithAll(list, all, ({ name, color, tree }) => [
+              price({ series: tree.costBasis.inProfit.perCoin, name: `${name} (coin)`, color }),
+              price({ series: tree.costBasis.inProfit.perDollar, name: `${name} (dollar)`, color }),
+            ]),
           },
           {
-            name: "Median",
-            title: title("Cost Basis Median (USD-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({
-                series: tree.costBasis.investedCapital.pct50,
-                name,
-                color,
-              }),
-            ),
-          },
-          {
-            name: "Q3",
-            title: title("Cost Basis Q3 (USD-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({
-                series: tree.costBasis.investedCapital.pct75,
-                name,
-                color,
-              }),
-            ),
-          },
-          {
-            name: "Q1",
-            title: title("Cost Basis Q1 (USD-weighted)"),
-            top: mapCohortsWithAll(list, all, ({ name, color, tree }) =>
-              price({
-                series: tree.costBasis.investedCapital.pct25,
-                name,
-                color,
-              }),
-            ),
+            name: "In Loss",
+            title: title("Cost Basis In Loss"),
+            top: flatMapCohortsWithAll(list, all, ({ name, color, tree }) => [
+              price({ series: tree.costBasis.inLoss.perCoin, name: `${name} (coin)`, color }),
+              price({ series: tree.costBasis.inLoss.perDollar, name: `${name} (dollar)`, color }),
+            ]),
           },
         ],
       },
@@ -269,11 +255,7 @@ export function createGroupedCostBasisSectionWithPercentiles({
         name: "Supply Density",
         title: title("Cost Basis Supply Density"),
         bottom: flatMapCohortsWithAll(list, all, ({ name, color, tree }) =>
-          percentRatio({
-            pattern: tree.costBasis.supplyDensity,
-            name,
-            color,
-          }),
+          percentRatio({ pattern: tree.costBasis.supplyDensity, name, color }),
         ),
       },
     ],

website/scripts/options/network.js

@@ -510,6 +510,7 @@ export function createNetworkSection() {
                   name: "Created",
                   color: colors.entity.output,
                   base: outputs.count.total.sum,
+                  average: outputs.count.total.rolling.average,
                   rolling: outputs.count.total.rolling.sum,
                   cumulative: outputs.count.total.cumulative,
                 },
@@ -517,6 +518,7 @@ export function createNetworkSection() {
                   name: "Spent",
                   color: colors.entity.input,
                   base: inputs.count.sum,
+                  average: inputs.count.rolling.average,
                   rolling: inputs.count.rolling.sum,
                   cumulative: inputs.count.cumulative,
                 },

website/scripts/options/series.js

@@ -84,12 +84,13 @@ export function price({
 
 /**
  * Create percentile series (max/min/median/pct75/pct25/pct90/pct10) from any stats pattern
- * @param {DistributionStats} pattern
- * @param {Unit} unit
- * @param {string} title
+ * @param {Object} args
+ * @param {DistributionStats} args.pattern
+ * @param {Unit} args.unit
+ * @param {string} [args.title]
  * @returns {AnyFetchedSeriesBlueprint[]}
  */
-function percentileSeries(pattern, unit, title) {
+function percentileSeries({ pattern, unit, title = "" }) {
   const { stat } = colors;
   return [
     dots({
@@ -418,9 +419,7 @@ export function fromBaseStatsPattern({
   unit,
   title = "",
   baseColor,
-  avgActive = true,
 }) {
-  const { stat } = colors;
   const stats = statsAtWindow(pattern, window);
   return [
     dots({
@@ -429,46 +428,17 @@ export function fromBaseStatsPattern({
       color: baseColor,
       unit,
     }),
-    dots({
-      series: stats.average,
-      name: `${title} avg`.trim(),
-      color: stat.avg,
-      unit,
-      defaultActive: avgActive,
-    }),
-    ...percentileSeries(stats, unit, title),
+    ...percentileSeries({ pattern: stats, unit, title }),
   ];
 }
 
 /**
- * Create series from a flat stats pattern (average + pct percentiles as single series)
- * Use statsAtWindow() to extract from patterns with _1y24h30d7dPattern stats
- * @param {Object} args
- * @param {{ average: AnySeriesPattern, median: AnySeriesPattern, max: AnySeriesPattern, min: AnySeriesPattern, pct75: AnySeriesPattern, pct25: AnySeriesPattern, pct90: AnySeriesPattern, pct10: AnySeriesPattern }} args.pattern
- * @param {Unit} args.unit
- * @param {string} [args.title]
- * @returns {AnyFetchedSeriesBlueprint[]}
- */
-export function fromStatsPattern({ pattern, unit, title = "" }) {
-  return [
-    {
-      type: "Dots",
-      series: pattern.average,
-      title: `${title} avg`.trim(),
-      unit,
-    },
-    ...percentileSeries(pattern, unit, title),
-  ];
-}
-
-/**
- * Extract stats at a specific rolling window from patterns with _1y24h30d7dPattern stats
- * @param {Record<string, any>} pattern - Pattern with pct10/pct25/pct75/pct90 and average/median/max/min as _1y24h30d7dPattern
+ * Extract stats at a specific rolling window
+ * @param {Record<string, any>} pattern - Pattern with pct10/pct25/pct75/pct90 and median/max/min as _1y24h30d7dPattern
  * @param {string} window
  */
 export function statsAtWindow(pattern, window) {
   return {
-    average: pattern.average[window],
     median: pattern.median[window],
     max: pattern.max[window],
     min: pattern.min[window],
@@ -601,10 +571,10 @@ export function distributionWindowsTree({ pattern, base, title, unit }) {
     tree: [
       {
         name: "Compare",
-        title: `${title} Average`,
+        title: `${title} Median`,
         bottom: ROLLING_WINDOWS.map((w) =>
           line({
-            series: pattern.average[w.key],
+            series: pattern.median[w.key],
             name: w.name,
             color: w.color,
             unit,
@@ -616,10 +586,7 @@ export function distributionWindowsTree({ pattern, base, title, unit }) {
         title: `${title} Distribution (${w.title})`,
         bottom: [
           ...(base ? [line({ series: base, name: "base", unit })] : []),
-          ...fromStatsPattern({
-            pattern: statsAtWindow(pattern, w.key),
-            unit,
-          }),
+          ...percentileSeries({ pattern: statsAtWindow(pattern, w.key), unit }),
         ],
       })),
     ],
@@ -628,12 +595,11 @@ export function distributionWindowsTree({ pattern, base, title, unit }) {
 
 /**
  * Map a rolling window slot's stats to a specific unit, producing a stats-compatible pattern
- * @param {{ average: Record<string, AnySeriesPattern>, median: Record<string, AnySeriesPattern>, max: Record<string, AnySeriesPattern>, min: Record<string, AnySeriesPattern>, pct75: Record<string, AnySeriesPattern>, pct25: Record<string, AnySeriesPattern>, pct90: Record<string, AnySeriesPattern>, pct10: Record<string, AnySeriesPattern> }} slot - Rolling window slot with multi-currency stats
+ * @param {{ median: Record<string, AnySeriesPattern>, max: Record<string, AnySeriesPattern>, min: Record<string, AnySeriesPattern>, pct75: Record<string, AnySeriesPattern>, pct25: Record<string, AnySeriesPattern>, pct90: Record<string, AnySeriesPattern>, pct10: Record<string, AnySeriesPattern> }} slot - Rolling window slot with multi-currency stats
  * @param {BtcSatsUsdKey} unitKey
  */
 function rollingSlotForUnit(slot, unitKey) {
   return {
-    average: slot.average[unitKey],
     median: slot.median[unitKey],
     max: slot.max[unitKey],
     min: slot.min[unitKey],
@@ -646,19 +612,19 @@ function rollingSlotForUnit(slot, unitKey) {
 
 /**
  * Create distribution series for btc/sats/usd from a rolling window slot
- * @param {{ average: Record<string, AnySeriesPattern>, median: Record<string, AnySeriesPattern>, max: Record<string, AnySeriesPattern>, min: Record<string, AnySeriesPattern>, pct75: Record<string, AnySeriesPattern>, pct25: Record<string, AnySeriesPattern>, pct90: Record<string, AnySeriesPattern>, pct10: Record<string, AnySeriesPattern> }} slot - Rolling window slot with multi-currency stats
+ * @param {{ median: Record<string, AnySeriesPattern>, max: Record<string, AnySeriesPattern>, min: Record<string, AnySeriesPattern>, pct75: Record<string, AnySeriesPattern>, pct25: Record<string, AnySeriesPattern>, pct90: Record<string, AnySeriesPattern>, pct10: Record<string, AnySeriesPattern> }} slot - Rolling window slot with multi-currency stats
  * @returns {AnyFetchedSeriesBlueprint[]}
  */
 export const distributionBtcSatsUsd = (slot) => [
-  ...fromStatsPattern({
+  ...percentileSeries({
     pattern: rollingSlotForUnit(slot, "btc"),
     unit: Unit.btc,
   }),
-  ...fromStatsPattern({
+  ...percentileSeries({
     pattern: rollingSlotForUnit(slot, "sats"),
     unit: Unit.sats,
   }),
-  ...fromStatsPattern({
+  ...percentileSeries({
     pattern: rollingSlotForUnit(slot, "usd"),
     unit: Unit.usd,
   }),
@@ -907,11 +873,7 @@ export function chartsFromFull({
     ? `${title} ${distributionSuffix}`
     : title;
   return [
-    {
-      name: "Per Block",
-      title,
-      bottom: [{ series: pattern.base, title: "base", unit }],
-    },
+    averagesTree({ windows: pattern.average, title, unit }),
     sumsTree({ windows: pattern.sum, title, unit }),
     distributionWindowsTree({ pattern, title: distTitle, unit }),
     {
@@ -948,16 +910,11 @@ export function chartsFromAggregated({
   unit,
   distributionSuffix = "",
 }) {
-  const { stat } = colors;
   const distTitle = distributionSuffix
     ? `${title} ${distributionSuffix}`
     : title;
   return [
-    {
-      name: "Per Block",
-      title,
-      bottom: [{ series: pattern.sum, title: "base", color: stat.sum, unit }],
-    },
+    averagesTree({ windows: pattern.rolling.average, title, unit }),
     sumsTree({ windows: pattern.rolling.sum, title, unit }),
     distributionWindowsTree({
       pattern: pattern.rolling,
@@ -996,12 +953,12 @@ export function chartsFromBlockAnd6b({ pattern, title, unit }) {
     {
       name: "Block",
       title: `${title} (Block)`,
-      bottom: fromStatsPattern({ pattern: pattern.block, unit }),
+      bottom: percentileSeries({ pattern: pattern.block, unit }),
     },
     {
       name: "Hourly",
       title: `${title} (Hourly)`,
-      bottom: fromStatsPattern({ pattern: pattern._6b, unit }),
+      bottom: percentileSeries({ pattern: pattern._6b, unit }),
     },
   ];
 }
@@ -1037,11 +994,7 @@ export function chartsFromSumsCumulative({ pattern, title, unit, color }) {
  */
 export function chartsFromCount({ pattern, title, unit, color }) {
   return [
-    {
-      name: "Per Block",
-      title,
-      bottom: [{ series: pattern.base, title: "base", color, unit }],
-    },
+    averagesTree({ windows: pattern.average, title, unit }),
     ...chartsFromSumsCumulative({ pattern, title, unit, color }),
   ];
 }
@@ -1060,6 +1013,7 @@ export function chartsFromCountEntries({ entries, title, unit }) {
       name,
       color: colors.at(i, arr.length),
       base: data.base,
+      average: data.average,
       rolling: data.sum,
       cumulative: data.cumulative,
     })),
@@ -1071,7 +1025,7 @@ export function chartsFromCountEntries({ entries, title, unit }) {
 /**
  * Per Block + Sums + Cumulative tree for multiple named series shown side-by-side
  * @param {Object} args
- * @param {Array<{ name: string, color: Color, base: AnySeriesPattern, rolling: { _24h: AnySeriesPattern, _1w: AnySeriesPattern, _1m: AnySeriesPattern, _1y: AnySeriesPattern }, cumulative: AnySeriesPattern }>} args.entries
+ * @param {Array<{ name: string, color: Color, base: AnySeriesPattern, average: { _24h: AnySeriesPattern, _1w: AnySeriesPattern, _1m: AnySeriesPattern, _1y: AnySeriesPattern }, rolling: { _24h: AnySeriesPattern, _1w: AnySeriesPattern, _1m: AnySeriesPattern, _1y: AnySeriesPattern }, cumulative: AnySeriesPattern }>} args.entries
  * @param {string} args.title
  * @param {Unit} args.unit
  * @returns {PartialOptionsTree}
@@ -1079,10 +1033,17 @@ export function chartsFromCountEntries({ entries, title, unit }) {
 export function multiSeriesTree({ entries, title, unit }) {
   return [
     {
-      name: "Per Block",
-      title,
-      bottom: entries.map((e) =>
-        line({ series: e.base, name: e.name, color: e.color, unit }),
+      name: "Compare",
+      title: `${title} Average`,
+      bottom: ROLLING_WINDOWS.flatMap((w) =>
+        entries.map((e) =>
+          line({
+            series: e.average[w.key],
+            name: `${e.name} ${w.name}`,
+            color: e.color,
+            unit,
+          }),
+        ),
       ),
     },
     ...ROLLING_WINDOWS.map((w) => ({

website/scripts/options/shared.js

@@ -224,21 +224,35 @@ export function satsBtcUsdRolling({ pattern, name, color, defaultActive }) {
  * @param {Color} [args.color]
  * @returns {PartialOptionsTree}
  */
-export function satsBtcUsdFullTree({ pattern, name, title, color }) {
+export function satsBtcUsdFullTree({ pattern, title, color }) {
   return [
     {
-      name: "Per Block",
-      title,
-      bottom: satsBtcUsd({ pattern: pattern.base, name, color }),
+      name: "Compare",
+      title: `${title} Average`,
+      bottom: ROLLING_WINDOWS.flatMap((w) =>
+        satsBtcUsd({
+          pattern: pattern.average[w.key],
+          name: w.name,
+          color: w.color,
+        }),
+      ),
     },
     ...ROLLING_WINDOWS.map((w) => ({
       name: w.name,
-      title: `${title} ${w.title} Sum`,
-      bottom: satsBtcUsd({
-        pattern: pattern.sum[w.key],
-        name: w.name,
-        color: w.color,
-      }),
+      title: `${title} ${w.title}`,
+      bottom: [
+        ...satsBtcUsd({
+          pattern: pattern.sum[w.key],
+          name: "Sum",
+          color: w.color,
+        }),
+        ...satsBtcUsd({
+          pattern: pattern.average[w.key],
+          name: "Avg",
+          color: w.color,
+          defaultActive: false,
+        }),
+      ],
     })),
     {
       name: "Cumulative",