apexcharts 8.3.0 → 8.4.0

package/src/features/stats.js

@@ -45,6 +45,7 @@ import { collapsedIndices, stashSeries } from '../modules/helpers/RawStash'
 import {
   binCounts,
   computeBinning,
+  deriveStat,
   derivedStats,
   fiveNumberSummary,
   isDerived,
@@ -204,45 +205,19 @@ function histogramTransform(ser, w) {
  * @returns {any[]}
  */
 function boxPlotTransform(ser, w) {
-  if (!Array.isArray(ser)) return ser
-  const whiskers = w.config.plotOptions?.boxPlot?.whiskers || 'minmax'
-  const derived = derivedStats(w, 'boxPlot')
-  /** @type {Array<Array<number[] | null>>} */
-  const observed = []
-
-  const out = ser.map((/** @type {any} */ s, /** @type {number} */ i) => {
-    // A combo's other series are not samples: a violin series carries its
-    // jitter in `points` too, and would have its density replaced.
-    if (!Array.isArray(s?.data) || (s.type && s.type !== 'boxPlot')) return s
-    let touched = false
-    /** @type {Array<number[] | null>} */
-    const byPoint = new Array(s.data.length).fill(null)
-    const data = s.data.map((/** @type {any} */ d, /** @type {number} */ j) => {
-      // An existing summary wins: this is the documented input shape. Unless we
-      // are the ones who derived it, in which case the options that shaped it
-      // may have changed.
-      const key = i + ':' + j
-      if (
-        Array.isArray(d?.y) &&
-        d.y.length === 5 &&
-        !isDerived(derived, key, d.y)
-      ) {
-        return d
-      }
-      const values = observationsOf(d, false)
-      if (!values) return d
-      const summary = fiveNumberSummary(values, { whiskers })
-      if (!summary) return d
-      touched = true
-      byPoint[j] = values
-      derived.set(key, summary.summary)
-      return { ...d, y: summary.summary, points: values }
-    })
-    if (touched) observed[i] = byPoint
-    return touched ? { ...s, data } : s
-  })
-  recordObservations(w, observed, ser.length)
-  return out
+  return sampleTransform(
+    ser,
+    w,
+    'boxPlot',
+    { whiskers: w.config.plotOptions?.boxPlot?.whiskers || 'minmax' },
+    fiveNumberSummary,
+    (/** @type {any} */ d) => Array.isArray(d?.y) && d.y.length === 5 && d.y,
+    (/** @type {any} */ d, /** @type {any} */ est, /** @type {number[]} */ values) => ({
+      ...d,
+      y: est.summary,
+      points: values,
+    }),
+  )
 }
 
 /**
@@ -261,43 +236,73 @@ function boxPlotTransform(ser, w) {
  * @returns {any[]}
  */
 function violinTransform(ser, w) {
-  if (!Array.isArray(ser)) return ser
   const kde = w.config.plotOptions?.violin?.kde || {}
-  const derived = derivedStats(w, 'violin')
+  return sampleTransform(
+    ser,
+    w,
+    'violin',
+    { bandwidth: kde.bandwidth, resolution: kde.resolution },
+    kernelDensity,
+    (/** @type {any} */ d) =>
+      Array.isArray(d?.y?.density) && d.y.density.length && d.y.density,
+    (/** @type {any} */ d, /** @type {any} */ est, /** @type {number[]} */ values) => ({
+      ...d,
+      // Keep the rest of an object `y`: a summary given with the points still
+      // draws the box lane.
+      y: {
+        ...(d.y && typeof d.y === 'object' && !Array.isArray(d.y) ? d.y : {}),
+        density: est.density,
+        points: values,
+      },
+    }),
+  )
+}
+
+/**
+ * The shared walk of the boxPlot and violin transforms: every datum of every
+ * series of `type` that carries a sample and no statistic of its own (or the
+ * one this transform wrote last pass) gets `fn(sample, opts)`, written by
+ * `write`.
+ *
+ * A combo's other series are not samples: a violin series carries its jitter
+ * in `points` too, and a boxPlot's or a rangeArea's `y` is a flat number
+ * array, which a violin would estimate into a density.
+ *
+ * @param {any[]} ser
+ * @param {any} w
+ * @param {string} type
+ * @param {any} opts
+ * @param {(values: number[], opts: any) => any} fn
+ * @param {(d: any) => any} statOf - the datum's own statistic, or falsy
+ * @param {(d: any, est: any, values: number[]) => any} write
+ * @returns {any[]}
+ */
+function sampleTransform(ser, w, type, opts, fn, statOf, write) {
+  if (!Array.isArray(ser)) return ser
+  const derived = derivedStats(w, type)
   /** @type {Array<Array<number[] | null>>} */
   const observed = []
 
   const out = ser.map((/** @type {any} */ s, /** @type {number} */ i) => {
-    // A combo's other series are not samples: a boxPlot's or a rangeArea's
-    // `y` is a flat number array too, and was estimated into a density.
-    if (!Array.isArray(s?.data) || (s.type && s.type !== 'violin')) return s
+    if (!Array.isArray(s?.data) || (s.type && s.type !== type)) return s
     let touched = false
     /** @type {Array<number[] | null>} */
     const byPoint = new Array(s.data.length).fill(null)
     const data = s.data.map((/** @type {any} */ d, /** @type {number} */ j) => {
+      // An existing statistic wins: this is the documented input shape. Unless
+      // we are the ones who derived it, in which case the options that shaped
+      // it may have changed.
       const key = i + ':' + j
-      if (
-        Array.isArray(d?.y?.density) &&
-        d.y.density.length &&
-        !isDerived(derived, key, d.y.density)
-      ) {
-        return d
-      }
-      const values = observationsOf(d, true)
+      const stat = statOf(d)
+      if (stat && !isDerived(derived, key, stat)) return d
+      // Only a density-based type reads a flat number `y` as the sample.
+      const values = observationsOf(d, type === 'violin')
       if (!values) return d
-      const est = kernelDensity(values, {
-        bandwidth: kde.bandwidth,
-        resolution: kde.resolution,
-      })
+      const est = deriveStat(derived, key, values, opts, fn)
       if (!est) return d
       touched = true
       byPoint[j] = values
-      // Keep the rest of an object `y`: a summary given with the points still
-      // draws the box lane.
-      const rest =
-        d.y && typeof d.y === 'object' && !Array.isArray(d.y) ? d.y : {}
-      derived.set(key, est.density)
-      return { ...d, y: { ...rest, density: est.density, points: values } }
+      return write(d, est, values)
     })
     if (touched) observed[i] = byPoint
     return touched ? { ...s, data } : s

package/src/modules/Animations.js

@@ -30,6 +30,57 @@ function easeOutBack(t) {
   return 1 + c3 * Math.pow(t - 1, 3) + c1 * Math.pow(t - 1, 2)
 }
 
+/**
+ * Each chart's mount frame loop: the steppers below (sweep, pop, draw) used
+ * to poll one requestAnimationFrame chain per element, so a line with 2,000
+ * markers and labels ran 4,000 callbacks a frame. They queue jobs here and
+ * share ONE rAF per chart per frame, which stops when the queue drains or
+ * the chart is destroyed. A job returns true to run again next frame, or a
+ * function: its writes, run once every job has done its reads. A job queued
+ * during a frame first runs on the next, as its own rAF did.
+ * State per chart: `q` the next frame's jobs, `n` the pops in flight.
+ * @type {WeakMap<object, any>}
+ */
+const loops = new WeakMap()
+
+/**
+ * @param {import('../types/internal').ChartStateW} w
+ * @param {(now: number) => any} job
+ * @returns {any} the chart's loop state
+ */
+function onFrame(w, job) {
+  let s = loops.get(w)
+  if (!s) loops.set(w, (s = { n: 0, q: [] }))
+  // The first job queued for a frame requests it.
+  if (s.q.push(job) < 2) {
+    BrowserAPIs.requestAnimationFrame((now) => {
+      const jobs = s.q
+      s.q = []
+      // for...of also visits the writes appended mid-loop, after every read.
+      for (const j of jobs) {
+        // A destroyed chart drops its queue and its pop count, checked per
+        // job: an animationEnd handler a job reaches may destroy it.
+        if (w.globals.isDestroyed) {
+          s.n = 0
+          break
+        }
+        // A throw (a user handler) loses only its own job, as when each
+        // element had its own rAF, and is reported once the frame is done.
+        try {
+          const r = j(now)
+          if (r === true) onFrame(w, j)
+          else if (r) jobs.push(r)
+        } catch (e) {
+          setTimeout(() => {
+            throw e
+          })
+        }
+      }
+    })
+  }
+  return s
+}
+
 /**
  * Cached reduced-motion query — `matchMedia` evaluation is cheap but the
  * MediaQueryList instance is reused if a chart re-renders.
@@ -116,29 +167,20 @@ export function applyProgressiveReveal(el, x, w) {
   const easedT = 1 - Math.cbrt(1 - xRatio)
   const revealDelay = easedT * drawSpeed
 
-  const node = el.node
-  const style = node.style
+  const style = el.node.style
   style.opacity = '0'
 
-  // Anchor on the first rAF after render — the same frame `animateDraw` uses
-  // as its t=0. All rAF callbacks scheduled in the current task receive the
-  // same timestamp in the next frame, so reveal and draw share an origin.
-  // Then poll rAFs (not setTimeout) so the snap happens on a frame boundary.
-  /** @type {number | null} */
-  let startAnchor = null
-  /** @param {number} now */
-  const tick = (now) => {
-    if (startAnchor === null) startAnchor = now
-    if (now - startAnchor >= revealDelay) {
-      // Clear the inline opacity rather than forcing '1' — an inline style
-      // would override the element's SVG `opacity` attribute (e.g. an
-      // x-axis range annotation rect with `opacity: 0.4`).
-      style.opacity = ''
-    } else {
-      BrowserAPIs.requestAnimationFrame(tick)
-    }
-  }
-  BrowserAPIs.requestAnimationFrame(tick)
+  // Anchor on the first frame after render, the same frame `animateDraw` uses
+  // as its t=0, so reveal and draw share an origin; snap on frame boundaries.
+  let startAnchor = -1
+  onFrame(w, (/** @type {number} */ now) => {
+    if (startAnchor < 0) startAnchor = now
+    if (now - startAnchor < revealDelay) return true
+    // Clear the inline opacity rather than forcing '1': an inline style
+    // would override the element's SVG `opacity` attribute (e.g. an
+    // x-axis range annotation rect with `opacity: 0.4`).
+    style.opacity = ''
+  })
   return true
 }
 
@@ -301,30 +343,25 @@ export default class Animations {
     style.transform = 'scale(0)'
     style.opacity = '0'
 
+    // Pops land in stagger order, so the animation is over when the LAST one
+    // lands: completion waits for the chart's pop count to drain. A destroyed
+    // chart's loop stops before it, so animationEnd never fires on a
+    // torn-down chart (react-apexcharts#602).
     const startAt = performance.now() + delay
-    /** @param {number} now */
-    const step = (now) => {
-      // Chart may have been destroyed before this frame ran (React StrictMode
-      // mount/unmount, route change). Bail without rescheduling and without
-      // onComplete, which would fire animationEnd on a torn-down chart. Mirrors
-      // the guard in animateDraw (see react-apexcharts#602).
-      if (w.globals.isDestroyed) return
+    const s = onFrame(w, (/** @type {number} */ now) => {
       const t = Math.max(0, Math.min(1, (now - startAt) / speed))
       style.transform = `scale(${easeOutBack(t)})`
       // Fade in over the first half so the back-out overshoot is visible
       // (rather than blasted in at full opacity from frame 1).
       style.opacity = String(Math.min(1, t * 2))
-      if (t < 1) {
-        BrowserAPIs.requestAnimationFrame(step)
-      } else {
-        style.transform = ''
-        style.transformOrigin = ''
-        style.transformBox = ''
-        style.opacity = ''
-        if (onComplete) onComplete()
-      }
-    }
-    BrowserAPIs.requestAnimationFrame(step)
+      if (t < 1) return true
+      style.transform = ''
+      style.transformOrigin = ''
+      style.transformBox = ''
+      style.opacity = ''
+      if (!--s.n && onComplete) onComplete()
+    })
+    s.n++
   }
 
   /*
@@ -423,9 +460,8 @@ export default class Animations {
 
     if (!w.globals.bulkRevealScheduled) {
       w.globals.bulkRevealScheduled = true
-      BrowserAPIs.requestAnimationFrame(() => {
-        // chart may have been destroyed before this frame ran (see animateDraw)
-        if (w.globals.isDestroyed) return
+      // the frame loop skips it on a chart destroyed before it ran
+      onFrame(w, () => {
         w.globals.bulkRevealScheduled = false
         const faded = w.globals.fadeRevealEls
         w.globals.fadeRevealEls = []
@@ -566,9 +602,7 @@ export default class Animations {
       node.setAttribute('mask', `url(#${maskId})`)
 
       const startAt = performance.now() + (delay || 0)
-      /** @param {number} now */
-      const step = (now) => {
-        if (w.globals.isDestroyed) return
+      onFrame(w, (/** @type {number} */ now) => {
         const t = Math.max(0, Math.min(1, (now - startAt) / speed))
         const eased = easeOutCubic(t)
         if (isRadial) {
@@ -576,15 +610,11 @@ export default class Animations {
         } else {
           revealEl.setAttribute('width', String(eased * targetWidth))
         }
-        if (t < 1) {
-          BrowserAPIs.requestAnimationFrame(step)
-        } else {
-          node.removeAttribute('mask')
-          if (mask.parentNode) mask.parentNode.removeChild(mask)
-          finalize()
-        }
-      }
-      BrowserAPIs.requestAnimationFrame(step)
+        if (t < 1) return true
+        node.removeAttribute('mask')
+        if (mask.parentNode) mask.parentNode.removeChild(mask)
+        finalize()
+      })
     }
 
     // Stroke draw via stroke-dashoffset (only safe when no custom dash pattern exists).
@@ -594,58 +624,35 @@ export default class Animations {
       node.setAttribute('stroke-dashoffset', String(len))
 
       const startAt = performance.now() + (delay || 0)
-      /** @param {number} now */
-      const step = (now) => {
-        if (w.globals.isDestroyed) return
+      onFrame(w, (/** @type {number} */ now) => {
         const t = Math.max(0, Math.min(1, (now - startAt) / speed))
         node.setAttribute('stroke-dashoffset', String(len * (1 - easeOutCubic(t))))
-        if (t < 1) {
-          BrowserAPIs.requestAnimationFrame(step)
-        } else {
-          node.removeAttribute('stroke-dasharray')
-          node.removeAttribute('stroke-dashoffset')
-          finalize()
-        }
-      }
-      BrowserAPIs.requestAnimationFrame(step)
+        if (t < 1) return true
+        node.removeAttribute('stroke-dasharray')
+        node.removeAttribute('stroke-dashoffset')
+        finalize()
+      })
     }
 
     // Defer one frame: callers (e.g. Line.js for forecast paths) set stroke-dasharray
-    // *after* renderPaths returns, so a sync check would miss it.
-    BrowserAPIs.requestAnimationFrame(() => {
-      // The chart may have been destroyed before this frame ran (e.g. React
-      // StrictMode mounts, unmounts, then remounts). Its DOM is gone, so bail
-      // before touching it. Fixes "Cannot read properties of null (reading
-      // 'node')" in runMaskReveal. See react-apexcharts#602.
-      if (w.globals.isDestroyed) return
-
-      if (isFill) {
-        runMaskReveal()
-        return
-      }
-
+    // *after* renderPaths returns, so a sync check would miss it. The job only
+    // reads (dash, length) and hands back its writes, which the loop runs
+    // after every path's reads, so N series cost one style and layout flush,
+    // not N. The loop skips it on a destroyed chart, whose DOM is gone
+    // (react-apexcharts#602).
+    onFrame(w, () => {
+      // A stroke with a custom dash pattern keeps it and reveals via the mask
+      // instead of fighting dashoffset.
       const existingDash = node.getAttribute('stroke-dasharray')
-      const hasCustomDash =
-        !!existingDash && existingDash !== '0' && existingDash !== ''
-      if (hasCustomDash) {
-        // Preserve dash pattern; reveal via mask instead of fighting dashoffset.
-        runMaskReveal()
-        return
-      }
+      if (isFill || (existingDash && existingDash !== '0')) return runMaskReveal
 
       let len = 0
       try {
-        if (typeof node.getTotalLength === 'function') {
-          len = node.getTotalLength()
-        }
+        len = node.getTotalLength()
       } catch (_) {
-        len = 0
-      }
-      if (!len) {
-        finalize()
-        return
+        // no geometry to measure: nothing to draw
       }
-      runStrokeDraw(len)
+      return len ? () => runStrokeDraw(len) : finalize
     })
   }
 

package/src/modules/AxisMapping.js

@@ -65,21 +65,56 @@ export default class AxisMapping {
   }
 
   /**
-   * Client (screen) x -> pixels from the plot origin. The origin is the svg
-   * element's left edge plus `translateX`, never the `.apexcharts-grid` box
-   * (fact 2 above), so the result does not depend on what the grid happens to
-   * render. `svgWidth` is the unscaled width the svg was drawn at, so the ratio
-   * against the measured one is the CSS zoom of any container the chart sits in.
+   * The plot area on screen, in client px: its corner is where the plot's
+   * group is translated to (translateX, translateY into the svg), and it is
+   * gridWidth by gridHeight. The one screen-to-plot measurement: the tooltip,
+   * zoom, selection and every other pointer reader map through it, so x and y
+   * cannot disagree under CSS zoom.
+   *
+   * Never the `.apexcharts-grid` group's box: a group measures to the union
+   * of what it happens to draw (fact 2 above). The plot's outline starts a
+   * pixel down (`Grid.drawGridArea`), so unless gridlines or row bands reach
+   * the top edge the box starts a pixel below the plot, and on a numeric-x bar
+   * chart the horizontal gridlines run `barPadForNumericAxis` out past both
+   * sides.
+   *
+   * `zoom` is the CSS zoom of any container the chart sits in (screen px per
+   * plot px): the measured svg width over `svgWidth`, the unscaled width it
+   * was drawn at. A distance measured on screen from this corner is divided
+   * by it to land in plot px, the space the series are laid out and painted in.
+   * With nothing mounted to measure, screen px are taken as svg px.
+   *
+   * @param {import('../types/internal').ChartStateW} w
+   * @returns {{ left: number, top: number, width: number, height: number, zoom: number }}
+   */
+  static plotRect(w) {
+    const svg =
+      w.dom.Paper?.node || w.dom.baseEl?.querySelector('.apexcharts-svg')
+    const box = (svg || w.dom.elWrap)?.getBoundingClientRect() || {
+      left: 0,
+      top: 0,
+      width: 0,
+    }
+    const zoom =
+      (svg && w.globals.svgWidth ? box.width / w.globals.svgWidth : 1) || 1
+    return {
+      left: box.left + w.layout.translateX * zoom,
+      top: box.top + w.layout.translateY * zoom,
+      width: w.layout.gridWidth * zoom,
+      height: w.layout.gridHeight * zoom,
+      zoom,
+    }
+  }
+
+  /**
+   * Client (screen) x -> pixels from the plot origin of {@link plotRect}.
+   * Pass the rect when the caller has already measured it.
    * @param {import('../types/internal').ChartStateW} w
    * @param {number} screenX
+   * @param {{ left: number, zoom: number }} [plot]
    * @returns {number}
    */
-  static screenXToPlotPx(w, screenX) {
-    const baseEl = w.dom.baseEl
-    const svg = baseEl && baseEl.querySelector('.apexcharts-svg')
-    if (!svg) return screenX - w.layout.translateX
-    const svgRect = svg.getBoundingClientRect()
-    const zoom = w.globals.svgWidth ? svgRect.width / w.globals.svgWidth : 1
-    return (screenX - svgRect.left) / (zoom || 1) - w.layout.translateX
+  static screenXToPlotPx(w, screenX, plot = AxisMapping.plotRect(w)) {
+    return (screenX - plot.left) / plot.zoom
   }
 }

package/src/modules/Base.js

@@ -133,23 +133,21 @@ export default class Base {
       // Cleared at the top of every parse, filled by features/stats, read by
       // Weave's api.data. null on every chart that has no such transform.
       seriesObservations: null,
-      // Waterfall accumulation — written by the waterfall series transform
+      // Waterfall accumulation, written by the waterfall series transform
       // (features/waterfall) each parse; empty for every other chart type.
-      //   values[i][j]     = the bar's signed height (end - start), which is
-      //                      the delta for a step bar and the sum for a
-      //                      subtotal / total bar. This is what a label and a
-      //                      tooltip show, in place of the "start - end" a
-      //                      range bar would otherwise read out.
-      //   cumulative[i][j] = the running total AFTER bar j, i.e. the level the
-      //                      connector to bar j+1 is drawn at.
-      //   kinds[i][j]      = 'positive' | 'negative' | 'subtotal' | 'total'
-      //   geometry[i][j]   = the px box the bar was actually drawn in, recorded
-      //                      by RangeBar. Present (as []) only on a waterfall,
-      //                      which is what tells RangeBar to record at all.
+      //   values[i][j]   = the bar's signed height (end - start), which is
+      //                    the delta for a step bar and the sum for a
+      //                    subtotal / total bar. This is what a label and a
+      //                    tooltip show, in place of the "start - end" a
+      //                    range bar would otherwise read out. Empty for a
+      //                    combo series of another type.
+      //   geometry[i][j] = the px box the bar was actually drawn in, recorded
+      //                    by RangeBar. The connectors are drawn from these
+      //                    boxes alone (the level is the box's far edge).
+      //                    Present (as []) only on a waterfall, which is what
+      //                    tells RangeBar to record at all.
       waterfallData: {
         values: [],
-        cumulative: [],
-        kinds: [],
         geometry: null,
       },
       // Dumbbell endpoints, written by the dumbbell series transform

package/src/modules/CoreUtils.js

@@ -91,29 +91,21 @@ class CoreUtils {
     return total
   }
 
-  // get total of the all values inside all series
   /**
-   * @param {number | null} [index]
+   * The total of one series; 0 for an index that names no series.
+   * @param {number} index
    */
-  getSeriesTotalByIndex(index = null) {
-    if (index === null) {
-      // non-plot chart types - pie / donut / circle
-      return /** @type {any[]} */ (this.w.config.series).reduce(
-        (/** @type {any} */ acc, /** @type {any} */ cur) => acc + cur,
-        0,
-      )
-    } else {
-      const seriesAtIndex = this.w.seriesData.series[index]
-      if (!Array.isArray(seriesAtIndex)) {
-        // pie/donut/polarArea/radialBar called per-index from legend loop
-        return seriesAtIndex ?? 0
-      }
-      // axis charts - supporting multiple series
-      return seriesAtIndex.reduce(
-        (/** @type {any} */ acc, /** @type {any} */ cur) => acc + cur,
-        0,
-      )
+  getSeriesTotalByIndex(index) {
+    const seriesAtIndex = this.w.seriesData.series[index]
+    if (!Array.isArray(seriesAtIndex)) {
+      // pie/donut/polarArea/radialBar called per-index from legend loop
+      return seriesAtIndex ?? 0
     }
+    // axis charts - supporting multiple series
+    return seriesAtIndex.reduce(
+      (/** @type {any} */ acc, /** @type {any} */ cur) => acc + cur,
+      0,
+    )
   }
 
   /**
@@ -328,29 +320,16 @@ class CoreUtils {
   }
 
   /**
-   * @param {number | null} [index]
+   * Does the series hold no value at all? True for an index that names none.
+   * @param {number} index
    */
-  isSeriesNull(index = null) {
-    let r = []
-    if (index === null) {
-      // non-plot chart types - pie / donut / circle
-      const series = /** @type {any[]} */ (this.w.config.series)
-      r = series.filter((/** @type {any} */ d) => d !== null)
-    } else {
-      const seriesAtIndex = this.w.seriesData.series[index]
-      if (Array.isArray(seriesAtIndex)) {
-        // axis charts - supporting multiple series
-        r = seriesAtIndex.filter((/** @type {any} */ d) => d !== null)
-      } else {
-        // pie/donut/polarArea/radialBar called per-index from legend loop
-        r =
-          seriesAtIndex !== null && seriesAtIndex !== undefined
-            ? [seriesAtIndex]
-            : []
-      }
-    }
-
-    return r.length === 0
+  isSeriesNull(index) {
+    const seriesAtIndex = this.w.seriesData.series[index]
+    // axis charts hold an array per series; pie/donut/polarArea/radialBar a
+    // single value, read per index from the legend loop
+    return Array.isArray(seriesAtIndex)
+      ? seriesAtIndex.every((/** @type {any} */ d) => d === null)
+      : seriesAtIndex == null
   }
 
   /**
@@ -750,14 +729,15 @@ class CoreUtils {
       return 0 // Should be Number.NEGATIVE_INFINITY
     }
     const w = this.w
+    const boundsIndex = w.globals.isMultipleYAxis ? seriesIndex : 0
     const min_log_val =
-      w.globals.minYArr[seriesIndex] === 0
+      w.globals.minYArr[boundsIndex] === 0
         ? -1 // make sure we dont calculate log of 0
-        : this.getBaseLog(b, w.globals.minYArr[seriesIndex])
+        : this.getBaseLog(b, w.globals.minYArr[boundsIndex])
     const max_log_val =
-      w.globals.maxYArr[seriesIndex] === 0
+      w.globals.maxYArr[boundsIndex] === 0
         ? 0 // make sure we dont calculate log of 0
-        : this.getBaseLog(b, w.globals.maxYArr[seriesIndex])
+        : this.getBaseLog(b, w.globals.maxYArr[boundsIndex])
     const number_of_height_levels = max_log_val - min_log_val
     // Values below 1 used to short-circuit to `d / number_of_height_levels`,
     // returning a raw data value where the caller expects a 0..1 fraction. On a