Merge pull request #3891 from JulienMalcouronne/feat/allow-stack-bar-…

…only-combo-chart feat: allow stack bar only
apexcharts · Oct 21, 2023 · 4c00acb · 4c00acb
2 parents 8d1c46f + 810620f
commit 4c00acb
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 8 deletions.
diff --git a/src/charts/Line.js b/src/charts/Line.js
@@ -509,6 +509,15 @@ class Line {
     }
 
     let y2 = y
+
+    let stackSeries =
+      w.config.chart.stacked &&
+      (!this.w.config.chart.stackOnlyBar ||
+        (this.w.config.series[realIndex] &&
+          this.w.config.series[realIndex].type &&
+          (this.w.config.series[realIndex].type === 'bar' ||
+            this.w.config.series[realIndex].type === '')))
+
     for (let j = 0; j < iterations; j++) {
       const isNull =
         typeof series[i][j + 1] === 'undefined' || series[i][j + 1] === null
@@ -524,7 +533,7 @@ class Line {
         x = x + this.xDivision
       }
 
-      if (w.config.chart.stacked) {
+      if (stackSeries) {
         if (
           i > 0 &&
           w.globals.collapsedSeries.length < w.config.series.length - 1

diff --git a/src/charts/common/line/Helpers.js b/src/charts/common/line/Helpers.js
@@ -104,8 +104,10 @@ export default class Helpers {
 
   determineFirstPrevY({ i, series, prevY, lineYPosition }) {
     let w = this.w
+    let stackSeries = w.config.chart.stacked && (!w.config.chart.stackOnlyBar || (series[i] && series[i].type && series[i].type === 'bar'));
+
     if (typeof series[i]?.[0] !== 'undefined') {
-      if (w.config.chart.stacked) {
+      if (stackSeries) {
         if (i > 0) {
           // 1st y value of previous series
           lineYPosition = this.lineCtx.prevSeriesY[i - 1][0]
@@ -126,7 +128,7 @@ export default class Helpers {
     } else {
       // the first value in the current series is null
       if (
-        w.config.chart.stacked &&
+        stackSeries &&
         i > 0 &&
         typeof series[i][0] === 'undefined'
       ) {

diff --git a/src/modules/Range.js b/src/modules/Range.js
@@ -554,12 +554,18 @@ class Range {
             stackedPoss[group][j] = 0
             stackedNegs[group][j] = 0
           }
-
-          if (gl.series[i][j] !== null && Utils.isNumber(gl.series[i][j])) {
-            gl.series[i][j] > 0
-              ? (stackedPoss[group][j] += parseFloat(gl.series[i][j]) + 0.0001)
-              : (stackedNegs[group][j] += parseFloat(gl.series[i][j]))
+          let stackSeries =
+            !this.w.config.chart.stackOnlyBar ||
+            (gl.series[i] && gl.series[i].type && gl.series[i].type === 'bar')
+
+          if (stackSeries) {
+            if (gl.series[i][j] !== null && Utils.isNumber(gl.series[i][j])) {
+              gl.series[i][j] > 0
+                ? (stackedPoss[group][j] += parseFloat(gl.series[i][j]) + 0.0001)
+                : (stackedNegs[group][j] += parseFloat(gl.series[i][j]))
+            }
           }
+
         }
       })
     })

diff --git a/src/modules/settings/Options.js b/src/modules/settings/Options.js
@@ -345,6 +345,7 @@ export default class Options {
           targets: undefined,
         },
         stacked: false,
+        stackOnlyBar: true, // mixed chart with stacked bars and line series - incorrect line draw #907
         stackType: 'normal',
         toolbar: {
           show: true,
@@ -925,6 +926,7 @@ export default class Options {
         enabled: true,
         enabledOnSeries: undefined,
         shared: true,
+        hideEmptyShared: true,
         followCursor: false, // when disabled, the tooltip will show on top of the series instead of mouse position
         intersect: false, // when enabled, tooltip will only show when user directly hovers over point
         inverseOrder: false,

diff --git a/src/modules/tooltip/Labels.js b/src/modules/tooltip/Labels.js
@@ -359,6 +359,17 @@ export default class Labels {
 
     if (shared && ttItemsChildren[0]) {
       // hide when no Val or series collapsed
+      if (w.config.tooltip.hideEmptyShared) {
+        let ttItemMarker = ttItems[t].querySelector('.apexcharts-tooltip-marker');
+        let ttItemText = ttItems[t].querySelector('.apexcharts-tooltip-text');
+        if (parseFloat(val) == 0) {
+          ttItemMarker.style.display = 'none';
+          ttItemText.style.display = 'none';
+        } else {
+          ttItemMarker.style.display = 'block';
+          ttItemText.style.display = 'block';
+        }
+      }
       if (
         typeof val === 'undefined' ||
         val === null ||