@rowsncolumns/charts 28.1.8 → 28.1.10

package/dist/esm/utils/trendline.js

@@ -29,15 +29,25 @@ const isFiniteNum = (v) => typeof v === "number" && Number.isFinite(v);
  * position as x (the first category is x = 1, see the module comment).
  * Non-finite y-values are dropped (they cannot be fitted).
  */
-const toPairs = (values) => {
+const toPairs = (values, xValues) => {
     const pairs = [];
     for (let i = 0; i < values.length; i++) {
         const y = values[i];
-        if (isFiniteNum(y))
+        if (!isFiniteNum(y))
+            continue;
+        if (xValues) {
+            const x = xValues[i];
+            if (isFiniteNum(x))
+                pairs.push({ x, y });
+        }
+        else {
             pairs.push({ x: i + 1, y });
+        }
     }
     return pairs;
 };
+/** Samples along a scatter trendline's x range: enough for the curved fits to read as curves. */
+const XY_TRENDLINE_SAMPLES = 64;
 /** Compute R² between observed y and predicted f(x) over the fit pairs. */
 const rSquaredOf = (pairs, predict) => {
     if (pairs.length < 2)
@@ -177,14 +187,22 @@ const fitPower = (pairs) => {
  * @param values  Raw y-values; the 1-based category position is used as x
  *                for the fit, the 0-based index is reported in the points.
  * @param spec    Trendline parameters (type/order/period/forecast).
+ * @param xValues Scatter / bubble only — the series' real X values, index-
+ *                aligned with `values`. The fit then runs on (x, y) pairs
+ *                (a regression of Y on X, what Excel draws on an XY chart;
+ *                the point index is wrong for unevenly spaced X), the
+ *                forecast extends the X range by that many X units, and the
+ *                points carry real X coordinates sampled across the range.
  */
-export const computeTrendline = (values, spec = {}) => {
-    const pairs = toPairs(values);
+export const computeTrendline = (values, spec = {}, xValues) => {
+    const pairs = toPairs(values, xValues);
     if (pairs.length < 2)
         return null;
     const type = spec.type ?? "linear";
-    const forward = Math.max(0, Math.floor(spec.forecastForward ?? 0));
-    const backward = Math.max(0, Math.floor(spec.forecastBackward ?? 0));
+    const forwardRaw = Math.max(0, spec.forecastForward ?? 0);
+    const backwardRaw = Math.max(0, spec.forecastBackward ?? 0);
+    const forward = xValues ? forwardRaw : Math.floor(forwardRaw);
+    const backward = xValues ? backwardRaw : Math.floor(backwardRaw);
     // Moving average is a smoothing of the observed values, not a fitted
     // function, so it is handled separately and ignores forecasting.
     if (type === "movingAvg") {
@@ -200,17 +218,51 @@ export const computeTrendline = (values, spec = {}) => {
                     count++;
                 }
             }
-            if (count > 0)
+            if (count === 0)
+                continue;
+            if (xValues) {
+                const x = xValues[i];
+                if (isFiniteNum(x))
+                    points.push({ x, y: sum / count });
+            }
+            else {
                 points.push({ x: i, y: sum / count });
+            }
         }
+        if (xValues)
+            points.sort((a, b) => a.x - b.x);
         return { points, rSquared: null, equation: null };
     }
-    // Fit domain is 1..n; a forecast of k periods extends it to 1−k / n+k.
-    const xStart = 1 - backward;
-    const xEnd = values.length + forward;
     const xs = [];
-    for (let x = xStart; x <= xEnd; x++)
-        xs.push(x);
+    if (xValues) {
+        // Sample the fitted curve across the data's X range, extended by the
+        // forecast in X units.
+        let minX = Infinity;
+        let maxX = -Infinity;
+        for (const p of pairs) {
+            if (p.x < minX)
+                minX = p.x;
+            if (p.x > maxX)
+                maxX = p.x;
+        }
+        const xStart = minX - backward;
+        const xEnd = maxX + forward;
+        if (xEnd > xStart) {
+            for (let i = 0; i <= XY_TRENDLINE_SAMPLES; i++) {
+                xs.push(xStart + ((xEnd - xStart) * i) / XY_TRENDLINE_SAMPLES);
+            }
+        }
+        else {
+            xs.push(xStart);
+        }
+    }
+    else {
+        // Fit domain is 1..n; a forecast of k periods extends it to 1−k / n+k.
+        const xStart = 1 - backward;
+        const xEnd = values.length + forward;
+        for (let x = xStart; x <= xEnd; x++)
+            xs.push(x);
+    }
     let predict = null;
     let equation = null;
     switch (type) {
@@ -263,9 +315,10 @@ export const computeTrendline = (values, spec = {}) => {
         default:
             return null;
     }
-    // Report the renderer-facing 0-based category index (see module comment).
+    // Report the renderer-facing 0-based category index (see module comment);
+    // an XY fit reports the real X it was sampled at.
     const points = xs
-        .map((x) => ({ x: x - 1, y: predict(x) }))
+        .map((x) => ({ x: xValues ? x : x - 1, y: predict(x) }))
         .filter((p) => Number.isFinite(p.y));
     if (points.length < 2)
         return null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rowsncolumns/charts",
-  "version": "28.1.8",
+  "version": "28.1.10",
   "author": "Vinay M",
   "license": "SEE LICENSE IN LICENSE.md",
   "main": "./dist/cjs/index.js",
@@ -70,9 +70,9 @@
     "@rowsncolumns/common-types": ">=5.3.2",
     "@rowsncolumns/grid": ">=13.2.35",
     "@rowsncolumns/icons": ">=7.2.33",
-    "@rowsncolumns/spreadsheet": ">=10.4.7",
+    "@rowsncolumns/spreadsheet": ">=10.4.8",
     "@rowsncolumns/spreadsheet-state": ">=29.1.8",
-    "@rowsncolumns/toolkit": ">=24.5.9",
+    "@rowsncolumns/toolkit": ">=24.5.10",
     "@rowsncolumns/ui": ">=16.0.4",
     "@rowsncolumns/utils": ">=9.5.5",
     "@types/react-plotly.js": "^2.6.3",