fix apexcharts#4601; correct alignment of datalabels in horizontal ba…

…r chart
rosco54 · Aug 8, 2024 · 8026349 · 8026349
1 parent cd995c5
commit 8026349
Showing 1 changed file with 34 additions and 24 deletions.
diff --git a/src/charts/common/bar/DataLabels.js b/src/charts/common/bar/DataLabels.js
@@ -89,7 +89,14 @@ export default class BarDataLabels {
       const yLabel = w.globals.series[i][j]
 
       textRects = graphics.getTextRects(
-        w.globals.yLabelFormatters[0](yLabel),
+        w.config.dataLabels.formatter
+          ? w.config.dataLabels.formatter(yLabel, {
+              ...w,
+              seriesIndex: i,
+              dataPointIndex: j,
+              w,
+            })
+          : w.globals.yLabelFormatters[0](yLabel),
         parseFloat(dataLabelsConfig.style.fontSize)
       )
     }
@@ -370,7 +377,6 @@ export default class BarDataLabels {
       i,
       j,
       realIndex,
-      columnGroupIndex,
       bcy,
       barHeight,
       barWidth,
@@ -419,28 +425,16 @@ export default class BarDataLabels {
         break
       case 'bottom':
         if (valIsNegative) {
-          dataLabelsX =
-            newX +
-            barWidth -
-            strokeWidth -
-            Math.round(textRects.width / 2) -
-            offX
+          dataLabelsX = newX + barWidth - strokeWidth - offX
         } else {
-          dataLabelsX =
-            newX -
-            barWidth +
-            strokeWidth +
-            Math.round(textRects.width / 2) +
-            offX
+          dataLabelsX = newX - barWidth + strokeWidth + offX
         }
         break
       case 'top':
         if (valIsNegative) {
-          dataLabelsX =
-            newX - strokeWidth + Math.round(textRects.width / 2) - offX
+          dataLabelsX = newX - strokeWidth - offX
         } else {
-          dataLabelsX =
-            newX - strokeWidth - Math.round(textRects.width / 2) + offX
+          dataLabelsX = newX - strokeWidth + offX
         }
         break
     }
@@ -475,10 +469,28 @@ export default class BarDataLabels {
     }
 
     if (!w.config.chart.stacked) {
-      if (dataLabelsX < 0) {
-        dataLabelsX = dataLabelsX + textRects.width + strokeWidth
-      } else if (dataLabelsX + textRects.width / 2 > w.globals.gridWidth) {
-        dataLabelsX = w.globals.gridWidth - textRects.width - strokeWidth
+      if (dataLabelsConfig.textAnchor === 'start') {
+        if (dataLabelsX - textRects.width < 0) {
+          dataLabelsX = valIsNegative
+            ? textRects.width + strokeWidth
+            : strokeWidth
+        } else if (dataLabelsX + textRects.width > w.globals.gridWidth) {
+          dataLabelsX = valIsNegative
+            ? w.globals.gridWidth - strokeWidth
+            : w.globals.gridWidth - textRects.width - strokeWidth
+        }
+      } else if (dataLabelsConfig.textAnchor === 'middle') {
+        if (dataLabelsX - textRects.width / 2 < 0) {
+          dataLabelsX = textRects.width / 2 + strokeWidth
+        } else if (dataLabelsX + textRects.width / 2 > w.globals.gridWidth) {
+          dataLabelsX = w.globals.gridWidth - textRects.width / 2 - strokeWidth
+        }
+      } else if (dataLabelsConfig.textAnchor === 'end') {
+        if (dataLabelsX < 1) {
+          dataLabelsX = textRects.width + strokeWidth
+        } else if (dataLabelsX + 1 > w.globals.gridWidth) {
+          dataLabelsX = w.globals.gridWidth - textRects.width - strokeWidth
+        }
       }
     }
 
@@ -618,8 +630,6 @@ export default class BarDataLabels {
     x,
     y,
     val,
-    barWidth,
-    barHeight,
     realIndex,
     textAnchor,
     barTotalDataLabelsConfig,