@opendata-ai/openchart-engine 7.1.1 → 7.1.3

package/dist/index.js

@@ -2,7 +2,7 @@
 import {
   adaptTheme as adaptTheme5,
   computeLabelBounds,
-  estimateTextWidth as estimateTextWidth21,
+  estimateTextWidth as estimateTextWidth20,
   generateAltText,
   generateDataTable,
   getBreakpoint,
@@ -9709,7 +9709,6 @@ import {
   abbreviateNumber as abbreviateNumber2,
   buildD3Formatter as buildD3Formatter5,
   buildTemporalFormatter,
-  estimateTextWidth as estimateTextWidth12,
   formatDate,
   formatNumber as formatNumber3
 } from "@opendata-ai/openchart-core";
@@ -9819,35 +9818,16 @@ function scaleSupportsTickCount(resolvedScale) {
   const scale = resolvedScale.scale;
   return "ticks" in scale && typeof scale.ticks === "function";
 }
-function categoricalTicks(resolvedScale, density, orientation = "horizontal", bandwidth, labelAngle, fontSize, fontWeight, measureText, subtitleContext) {
+function categoricalTicks(resolvedScale, density, orientation = "horizontal", subtitleContext) {
   const scale = resolvedScale.scale;
   const domain = scale.domain();
   const catAxisCfg = resolvedScale.channel.axis || void 0;
   const explicitTickCount = catAxisCfg?.tickCount;
   let selectedValues = domain;
   if (resolvedScale.type === "band" && orientation === "horizontal") {
-    if (bandwidth !== void 0 && bandwidth > 0 && fontSize !== void 0) {
-      const maxLabelWidth = domain.reduce((max4, v) => {
-        const w = measureText ? measureText(v, fontSize, fontWeight ?? 400).width : estimateTextWidth12(v, fontSize, fontWeight ?? 400);
-        return Math.max(max4, w);
-      }, 0);
-      const angleRad = labelAngle !== void 0 ? Math.abs(labelAngle) * Math.PI / 180 : 0;
-      const footprint = angleRad > 0 ? maxLabelWidth * Math.abs(Math.cos(angleRad)) : maxLabelWidth;
-      const minGap = fontSize * 0.5;
-      if (footprint + minGap > bandwidth) {
-        const maxFitting = Math.max(1, Math.floor(bandwidth / (footprint + minGap)));
-        const cap = explicitTickCount ?? Math.min(domain.length, Math.max(maxFitting, TICK_COUNTS[density]));
-        if (domain.length > cap) {
-          const step = Math.ceil(domain.length / cap);
-          selectedValues = domain.filter((_, i) => i % step === 0);
-        }
-      }
-    } else {
-      const maxTicks = explicitTickCount ?? TICK_COUNTS[density];
-      if ((explicitTickCount || density !== "full") && domain.length > maxTicks) {
-        const step = Math.ceil(domain.length / maxTicks);
-        selectedValues = domain.filter((_, i) => i % step === 0);
-      }
+    if (explicitTickCount && domain.length > explicitTickCount) {
+      const step = Math.ceil(domain.length / explicitTickCount);
+      selectedValues = domain.filter((_, i) => i % step === 0);
     }
   } else if (resolvedScale.type !== "band") {
     const maxTicks = explicitTickCount ?? TICK_COUNTS[density];
@@ -9958,6 +9938,34 @@ function fitContinuousTicks(scale, initialTicks, initialCount, fontSize, fontWei
   const fallback = bestWithinFloor ?? buildContinuousTicks(scale, floor);
   return thinTicksUntilFit(fallback, fontSize, fontWeight, measureText, orientation);
 }
+function bandTicksOverlapAtAngle(ticks2, angleDeg, fontSize, fontWeight, measureText) {
+  if (ticks2.length < 2) return false;
+  const angleRad = Math.abs(angleDeg) * Math.PI / 180;
+  const cosA = angleRad > 0 ? Math.abs(Math.cos(angleRad)) : 1;
+  const minGap = fontSize * 0.5;
+  for (let i = 0; i < ticks2.length - 1; i++) {
+    const aWidth = measureLabel(ticks2[i].label, fontSize, fontWeight, measureText) * cosA;
+    const bWidth = measureLabel(ticks2[i + 1].label, fontSize, fontWeight, measureText) * cosA;
+    const aRight = ticks2[i].position + aWidth / 2;
+    const bLeft = ticks2[i + 1].position - bWidth / 2;
+    if (aRight + minGap > bLeft) return true;
+  }
+  return false;
+}
+function thinBandTicksIfNeeded(ticks2, angleDeg, fontSize, fontWeight, measureText) {
+  if (!bandTicksOverlapAtAngle(ticks2, angleDeg, fontSize, fontWeight, measureText)) return ticks2;
+  let current = ticks2;
+  while (current.length > 2) {
+    const thinned = [current[0]];
+    for (let i = 2; i < current.length - 1; i += 2) {
+      thinned.push(current[i]);
+    }
+    if (current.length > 1) thinned.push(current[current.length - 1]);
+    current = thinned;
+    if (!bandTicksOverlapAtAngle(current, angleDeg, fontSize, fontWeight, measureText)) break;
+  }
+  return current;
+}
 function computeAxes(scales, chartArea, strategy, theme, measureText, dataContext) {
   const result = {};
   const baseDensity = strategy.axisLabelDensity;
@@ -9998,17 +10006,7 @@ function computeAxes(scales, chartArea, strategy, theme, measureText, dataContex
     if (axisConfig?.values) {
       allTicks = resolveExplicitTicks(axisConfig.values, scales.x);
     } else if (!isContinuousX) {
-      const xBandwidth = scales.x.type === "band" ? scales.x.scale.bandwidth() : void 0;
-      allTicks = categoricalTicks(
-        scales.x,
-        xDensity,
-        "horizontal",
-        xBandwidth,
-        axisConfig?.labelAngle,
-        fontSize,
-        fontWeight,
-        measureText
-      );
+      allTicks = categoricalTicks(scales.x, xDensity, "horizontal");
     } else {
       allTicks = continuousTicks(scales.x, xDensity, xTargetCount);
     }
@@ -10016,11 +10014,25 @@ function computeAxes(scales, chartArea, strategy, theme, measureText, dataContex
       position: t.position,
       major: true
     }));
+    let tickAngle = axisConfig?.labelAngle;
+    if (tickAngle === void 0 && scales.x.type === "band" && allTicks.length > 1) {
+      const bandwidth = scales.x.scale.bandwidth();
+      let maxLabelWidth = 0;
+      for (const t of allTicks) {
+        const w = measureLabel(t.label, fontSize, fontWeight, measureText);
+        if (w > maxLabelWidth) maxLabelWidth = w;
+      }
+      if (maxLabelWidth > bandwidth * 0.85) {
+        tickAngle = -45;
+      }
+    }
     const hasExplicitValues = !!axisConfig?.values;
-    const shouldThin = scales.x.type !== "band" && !hasExplicitValues;
     let ticks2;
-    if (!shouldThin) {
+    if (hasExplicitValues) {
       ticks2 = allTicks;
+    } else if (scales.x.type === "band") {
+      const effectiveAngle = tickAngle ?? 0;
+      ticks2 = thinBandTicksIfNeeded(allTicks, effectiveAngle, fontSize, fontWeight, measureText);
     } else if (isContinuousX) {
       ticks2 = fitContinuousTicks(
         scales.x,
@@ -10035,18 +10047,6 @@ function computeAxes(scales, chartArea, strategy, theme, measureText, dataContex
     } else {
       ticks2 = thinTicksUntilFit(allTicks, fontSize, fontWeight, measureText);
     }
-    let tickAngle = axisConfig?.labelAngle;
-    if (tickAngle === void 0 && scales.x.type === "band" && ticks2.length > 1) {
-      const bandwidth = scales.x.scale.bandwidth();
-      let maxLabelWidth = 0;
-      for (const t of ticks2) {
-        const w = measureLabel(t.label, fontSize, fontWeight, measureText);
-        if (w > maxLabelWidth) maxLabelWidth = w;
-      }
-      if (maxLabelWidth > bandwidth * 0.85) {
-        tickAngle = -45;
-      }
-    }
     const axisTitle = axisConfig?.title;
     const xLabelColor = axisConfig?.labelColor;
     const xTickPosition = axisConfig?.tickPosition ?? "gutter";
@@ -10084,11 +10084,6 @@ function computeAxes(scales, chartArea, strategy, theme, measureText, dataContex
         scales.y,
         yDensity,
         "vertical",
-        void 0,
-        void 0,
-        void 0,
-        void 0,
-        void 0,
         yFieldName && yLabelField && dataContext ? { data: dataContext.data, fieldName: yFieldName, labelField: yLabelField } : void 0
       );
     } else {
@@ -10153,7 +10148,7 @@ import {
   AXIS_TITLE_TRAILING_PAD as AXIS_TITLE_TRAILING_PAD2,
   BREAKPOINT_COMPACT_MAX as BREAKPOINT_COMPACT_MAX2,
   computeChrome as computeChrome3,
-  estimateTextWidth as estimateTextWidth16,
+  estimateTextWidth as estimateTextWidth15,
   getAxisTitleOffset as getAxisTitleOffset2,
   HPAD_COMPACT_FRACTION,
   HPAD_COMPACT_MIN,
@@ -10169,7 +10164,7 @@ import {
 } from "@opendata-ai/openchart-core";
 
 // src/endpoint-labels/predict.ts
-import { estimateTextWidth as estimateTextWidth13, wrapText as wrapText2 } from "@opendata-ai/openchart-core";
+import { estimateTextWidth as estimateTextWidth12, wrapText as wrapText2 } from "@opendata-ai/openchart-core";
 function predictEndpointLabelsWidth(spec, _theme) {
   if (spec.endpointLabels === false) return 0;
   if (spec.markType !== "line" && spec.markType !== "area") return 0;
@@ -10191,7 +10186,7 @@ function predictEndpointLabelsWidth(spec, _theme) {
   for (const name of seriesNames) {
     const lines = wrapText2(name, ENDPOINT_LABEL_FONT_SIZE, ENDPOINT_LABEL_FONT_WEIGHT, wrapWidth);
     for (const line of lines) {
-      const w = estimateTextWidth13(line, ENDPOINT_LABEL_FONT_SIZE, ENDPOINT_LABEL_FONT_WEIGHT);
+      const w = estimateTextWidth12(line, ENDPOINT_LABEL_FONT_SIZE, ENDPOINT_LABEL_FONT_WEIGHT);
       if (w > maxLabelWidth) maxLabelWidth = w;
     }
   }
@@ -10211,14 +10206,14 @@ function predictEndpointLabelsWidth(spec, _theme) {
     else if (maxAbs >= 1e6) sample = "1.5M";
     else if (maxAbs >= 1e3) sample = "1.5K";
     else sample = String(Math.round(maxAbs * 100) / 100);
-    valueWidth = estimateTextWidth13(sample, ENDPOINT_VALUE_FONT_SIZE, ENDPOINT_VALUE_FONT_WEIGHT);
+    valueWidth = estimateTextWidth12(sample, ENDPOINT_VALUE_FONT_SIZE, ENDPOINT_VALUE_FONT_WEIGHT);
   }
   const textColumn = Math.max(maxLabelWidth, valueWidth);
   return ENDPOINT_SWATCH_SIZE + ENDPOINT_GAP + textColumn + 4;
 }
 
 // src/legend/wrap.ts
-import { COMPACT_WIDTH, estimateTextWidth as estimateTextWidth14 } from "@opendata-ai/openchart-core";
+import { COMPACT_WIDTH, estimateTextWidth as estimateTextWidth13 } from "@opendata-ai/openchart-core";
 var SWATCH_SIZE2 = 12;
 var SWATCH_GAP2 = 6;
 var ENTRY_GAP2 = 16;
@@ -10237,7 +10232,7 @@ function measureLegendWrap(entries, maxWidth, labelStyle, maxRows, entryGap = EN
   let fittingCount = entries.length;
   let fittingCountLocked = false;
   for (let i = 0; i < entries.length; i++) {
-    const labelWidth = estimateTextWidth14(
+    const labelWidth = estimateTextWidth13(
       entries[i].label,
       labelStyle.fontSize,
       labelStyle.fontWeight
@@ -10260,7 +10255,7 @@ function measureLegendWrap(entries, maxWidth, labelStyle, maxRows, entryGap = EN
 }
 
 // src/layout/metrics.ts
-import { estimateTextWidth as estimateTextWidth15 } from "@opendata-ai/openchart-core";
+import { estimateTextWidth as estimateTextWidth14 } from "@opendata-ai/openchart-core";
 var LABEL_FONT_SIZE7 = 10;
 var VALUE_FONT_SIZE2 = 22;
 var LABEL_LINE_HEIGHT_RATIO = 1.4;
@@ -10289,7 +10284,7 @@ function computeMetricBar(metrics, metricsTopY, metricsArea, remainingChartHeigh
   const cellWidth = metricsArea.width / metrics.length;
   for (const metric of metrics) {
     const text = valueRunText(metric);
-    const measured = measureText ? measureText(text, VALUE_FONT_SIZE2, 510).width : estimateTextWidth15(text, VALUE_FONT_SIZE2, 510);
+    const measured = measureText ? measureText(text, VALUE_FONT_SIZE2, 510).width : estimateTextWidth14(text, VALUE_FONT_SIZE2, 510);
     if (measured > cellWidth - CELL_INNER_PAD) return void 0;
   }
   const labelLine = LABEL_FONT_SIZE7 * LABEL_LINE_HEIGHT_RATIO;
@@ -10421,7 +10416,7 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
     if (xField) {
       for (const row of spec.data) {
         const label = String(row[xField] ?? "");
-        const w = estimateTextWidth16(label, theme.fonts.sizes.axisTick, theme.fonts.weights.normal);
+        const w = estimateTextWidth15(label, theme.fonts.sizes.axisTick, theme.fonts.weights.normal);
         if (w > maxLabelWidth) maxLabelWidth = w;
       }
     }
@@ -10473,7 +10468,7 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
         const label = String(row[colorField] ?? "");
         if (!seen.has(label)) {
           seen.add(label);
-          const w = estimateTextWidth16(label, 11, 600);
+          const w = estimateTextWidth15(label, 11, 600);
           if (w > maxLabelWidth) maxLabelWidth = w;
         }
       }
@@ -10493,7 +10488,7 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
       const maxXStr = String(maxX);
       for (const ann of spec.annotations) {
         if (ann.type === "text" && String(ann.x) === maxXStr) {
-          const textWidth = estimateTextWidth16(ann.text, ann.fontSize ?? 11, ann.fontWeight ?? 600);
+          const textWidth = estimateTextWidth15(ann.text, ann.fontSize ?? 11, ann.fontWeight ?? 600);
           const dx = ann.offset?.dx ?? 0;
           const anchor = ann.anchor ?? "auto";
           const baseRightExtent = anchor === "left" ? textWidth : (
@@ -10524,12 +10519,12 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
       let maxLabelWidth = 0;
       for (const row of spec.data) {
         const label = String(row[yField] ?? "");
-        let w = estimateTextWidth16(label, theme.fonts.sizes.axisTick, theme.fonts.weights.normal);
+        let w = estimateTextWidth15(label, theme.fonts.sizes.axisTick, theme.fonts.weights.normal);
         if (yLabelField) {
           const subtitle = String(row[yLabelField] ?? "");
           if (subtitle) {
             const gap = theme.fonts.sizes.axisTick * 0.6;
-            const subtitleWidth = estimateTextWidth16(
+            const subtitleWidth = estimateTextWidth15(
               subtitle,
               theme.fonts.sizes.axisTick,
               theme.fonts.weights.normal
@@ -10572,7 +10567,7 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
       }
       const negPrefix = spec.data.some((r) => Number(r[yField]) < 0) ? "-" : "";
       const labelEst = negPrefix + sampleLabel;
-      const labelWidth = estimateTextWidth16(
+      const labelWidth = estimateTextWidth15(
         labelEst,
         theme.fonts.sizes.axisTick,
         theme.fonts.weights.normal
@@ -10608,7 +10603,7 @@ function computeDimensions(spec, options, legendLayout, theme, strategy, waterma
         else sampleLabelForTitle = "0.0";
       }
       const negPrefixForTitle = spec.data.some((r) => Number(r[yFieldForTitle]) < 0) ? "-" : "";
-      estTickLabelWidth = estimateTextWidth16(
+      estTickLabelWidth = estimateTextWidth15(
         negPrefixForTitle + sampleLabelForTitle,
         theme.fonts.sizes.axisTick,
         theme.fonts.weights.normal
@@ -11202,7 +11197,7 @@ function computeScales(spec, chartArea, data) {
 }
 
 // src/legend/compute.ts
-import { BRAND_RESERVE_WIDTH as BRAND_RESERVE_WIDTH2, COMPACT_WIDTH as COMPACT_WIDTH2, estimateTextWidth as estimateTextWidth17 } from "@opendata-ai/openchart-core";
+import { BRAND_RESERVE_WIDTH as BRAND_RESERVE_WIDTH2, COMPACT_WIDTH as COMPACT_WIDTH2, estimateTextWidth as estimateTextWidth16 } from "@opendata-ai/openchart-core";
 var LEGEND_PADDING = 8;
 var LEGEND_RIGHT_WIDTH = 120;
 var RIGHT_LEGEND_MAX_HEIGHT_RATIO = 0.4;
@@ -11318,7 +11313,7 @@ function computeLegend(spec, strategy, theme, chartArea, watermark = true) {
   }
   if (resolvedPosition === "right" || resolvedPosition === "bottom-right") {
     const maxLabelWidth = Math.max(
-      ...entries.map((e) => estimateTextWidth17(e.label, labelStyle.fontSize, labelStyle.fontWeight))
+      ...entries.map((e) => estimateTextWidth16(e.label, labelStyle.fontSize, labelStyle.fontWeight))
     );
     const legendWidth = Math.min(
       LEGEND_RIGHT_WIDTH,
@@ -11381,7 +11376,7 @@ function computeLegend(spec, strategy, theme, chartArea, watermark = true) {
     entries = truncateEntries(entries, fittingCount);
   }
   const totalWidth = entries.reduce((sum2, entry) => {
-    const labelWidth = estimateTextWidth17(entry.label, labelStyle.fontSize, labelStyle.fontWeight);
+    const labelWidth = estimateTextWidth16(entry.label, labelStyle.fontSize, labelStyle.fontWeight);
     return sum2 + SWATCH_SIZE2 + SWATCH_GAP2 + labelWidth + effectiveEntryGap;
   }, 0);
   const { rowCount } = measureLegendWrap(
@@ -11418,7 +11413,7 @@ import {
   adaptTheme as adaptTheme3,
   buildD3Formatter as buildD3Formatter6,
   computeChrome as computeChrome4,
-  estimateTextWidth as estimateTextWidth18,
+  estimateTextWidth as estimateTextWidth17,
   formatNumber as formatNumber4,
   resolveTheme as resolveTheme4
 } from "@opendata-ai/openchart-core";
@@ -12099,7 +12094,7 @@ function compileSankey(spec, options) {
     if (labelsLeft) continue;
     const labelX = (node.x1 ?? nodeWidth) + LABEL_GAP;
     const labelText = node.label ?? node.id;
-    const labelWidth = estimateTextWidth18(labelText, labelFontSize, labelFontWeight);
+    const labelWidth = estimateTextWidth17(labelText, labelFontSize, labelFontWeight);
     const overflow = labelX + labelWidth - rightEdge;
     if (overflow > maxOverflow) maxOverflow = overflow;
   }
@@ -12363,7 +12358,7 @@ function emptyLayout3(area, chrome, theme, options, watermark) {
 }
 
 // src/tables/compile-table.ts
-import { computeChrome as computeChrome5, estimateTextWidth as estimateTextWidth19 } from "@opendata-ai/openchart-core";
+import { computeChrome as computeChrome5, estimateTextWidth as estimateTextWidth18 } from "@opendata-ai/openchart-core";
 
 // src/tables/bar-column.ts
 var NEGATIVE_BAR_COLOR = "#c44e52";
@@ -12778,13 +12773,13 @@ function estimateColumnWidth(col, data, fontSize) {
   if (col.image) return (col.image.width ?? 24) + PADDING;
   if (col.flag) return 60;
   const label = col.label ?? col.key;
-  const headerWidth = estimateTextWidth19(label, fontSize, 600) + PADDING;
+  const headerWidth = estimateTextWidth18(label, fontSize, 600) + PADDING;
   const sampleSize = Math.min(100, data.length);
   let maxDataWidth = 0;
   for (let i = 0; i < sampleSize; i++) {
     const val = data[i][col.key];
     const text = val == null ? "" : String(val);
-    const width = estimateTextWidth19(text, fontSize, 400) + PADDING;
+    const width = estimateTextWidth18(text, fontSize, 400) + PADDING;
     if (width > maxDataWidth) maxDataWidth = width;
   }
   return Math.max(MIN_WIDTH, headerWidth, maxDataWidth);
@@ -13013,7 +13008,7 @@ import {
   adaptTheme as adaptTheme4,
   buildD3Formatter as buildD3Formatter8,
   computeChrome as computeChrome6,
-  estimateTextWidth as estimateTextWidth20,
+  estimateTextWidth as estimateTextWidth19,
   formatNumber as formatNumber6,
   resolveTheme as resolveTheme5,
   SEQUENTIAL_PALETTES
@@ -13233,7 +13228,7 @@ function compileTileMap(spec, options) {
     height: contentHeight,
     animation: resolvedAnimation,
     watermark,
-    measureText: options.measureText ?? ((text, fontSize) => ({ width: estimateTextWidth20(text, fontSize), height: fontSize }))
+    measureText: options.measureText ?? ((text, fontSize) => ({ width: estimateTextWidth19(text, fontSize), height: fontSize }))
   };
 }
 function emptyLayout4(chrome, theme, options, watermark) {
@@ -13268,7 +13263,7 @@ function emptyLayout4(chrome, theme, options, watermark) {
     height: options.height,
     watermark,
     animation: void 0,
-    measureText: options.measureText ?? ((text, fontSize) => ({ width: estimateTextWidth20(text, fontSize), height: fontSize }))
+    measureText: options.measureText ?? ((text, fontSize) => ({ width: estimateTextWidth19(text, fontSize), height: fontSize }))
   };
 }
 
@@ -14287,7 +14282,7 @@ function compileChart(spec, options) {
     else sample = "0.0";
     const negPrefix = renderSpec.data.some((r) => Number(r[yField]) < 0) ? "-" : "";
     const labelEst = negPrefix + sample;
-    const labelWidth = estimateTextWidth21(
+    const labelWidth = estimateTextWidth20(
       labelEst,
       theme.fonts.sizes.axisTick,
       theme.fonts.weights.normal