diff --git a/src/charts/BarStacked.js b/src/charts/BarStacked.js index f7e3b3212..394495913 100644 --- a/src/charts/BarStacked.js +++ b/src/charts/BarStacked.js @@ -85,7 +85,7 @@ class BarStacked extends Bar { }) let elGoalsMarkers = this.graphics.group({ - class: 'apexcharts-bar-goals-markers' + class: 'apexcharts-bar-goals-markers', }) let barHeight = 0 diff --git a/src/charts/common/bar/DataLabels.js b/src/charts/common/bar/DataLabels.js index 761019a41..125c1cd53 100644 --- a/src/charts/common/bar/DataLabels.js +++ b/src/charts/common/bar/DataLabels.js @@ -146,6 +146,7 @@ export default class BarDataLabels { totalDataLabels = this.drawTotalDataLabels({ x: dataLabelsPos.totalDataLabelsX, y: dataLabelsPos.totalDataLabelsY, + barWidth, realIndex, textAnchor: dataLabelsPos.totalDataLabelsAnchor, val: this.getStackedTotalDataLabel({ realIndex, j }), @@ -606,10 +607,12 @@ export default class BarDataLabels { x, y, val, + barWidth, realIndex, textAnchor, barTotalDataLabelsConfig, }) { + const w = this.w const graphics = new Graphics(this.barCtx.ctx) let totalDataLabelText @@ -621,7 +624,11 @@ export default class BarDataLabels { this.barCtx.lastActiveBarSerieIndex === realIndex ) { totalDataLabelText = graphics.drawText({ - x: x, + x: + x - + (w.globals.seriesGroups.length + ? barWidth / w.globals.seriesGroups.length + : 0), y: y, foreColor: barTotalDataLabelsConfig.style.color, text: val, diff --git a/src/modules/DataLabels.js b/src/modules/DataLabels.js index aad434c5a..aaa0fa3e3 100644 --- a/src/modules/DataLabels.js +++ b/src/modules/DataLabels.js @@ -217,8 +217,8 @@ class DataLabels { if (correctedLabels.textRects) { // fixes #2264 if ( - x < -10 - correctedLabels.textRects.width || - x > w.globals.gridWidth + correctedLabels.textRects.width + 10 + x < -20 - correctedLabels.textRects.width || + x > w.globals.gridWidth + correctedLabels.textRects.width + 30 ) { // datalabels fall outside drawing area, so draw a blank label text = ''