fix: mixing bars with line or area series breaks legend toggle (#410)

fixes #399

src/chart_types/xy_chart/utils/scales.test.ts

@@ -162,4 +162,36 @@ describe('Series scales', () => {
     expect(stackedBarsInCluster).toBe(2);
     expect(totalBarsInCluster).toBe(14);
   });
+  describe('bandwidth when totalBarsInCluster is greater than 0 or less than 0', () => {
+    const xDomainLinear: XDomain = {
+      type: 'xDomain',
+      isBandScale: true,
+      domain: [0, 3],
+      minInterval: 1,
+      scaleType: ScaleType.Linear,
+    };
+    const maxRange = 120;
+    const scaleOver0 = computeXScale({
+      xDomain: xDomainLinear,
+      totalBarsInCluster: 2,
+      range: [0, maxRange],
+      barsPadding: 0,
+      enableHistogramMode: false,
+    });
+
+    test('totalBarsInCluster greater than 0', () => {
+      expect(scaleOver0.bandwidth).toBe(maxRange / 4 / 2);
+    });
+
+    const scaleUnder0 = computeXScale({
+      xDomain: xDomainLinear,
+      totalBarsInCluster: 0,
+      range: [0, maxRange],
+      barsPadding: 0,
+      enableHistogramMode: false,
+    });
+    test('totalBarsInCluster less than 0', () => {
+      expect(scaleUnder0.bandwidth).toBe(maxRange / 4);
+    });
+  });
 });

src/chart_types/xy_chart/utils/scales.ts

@@ -51,7 +51,6 @@ function getBandScaleRange(
   const rangeEndOffset = isSingleValueHistogram ? 0 : bandwidth;
   const start = isInverse ? minRange - rangeEndOffset : minRange;
   const end = isInverse ? maxRange : maxRange - rangeEndOffset;
-
   return { start, end };
 }
 
@@ -100,7 +99,7 @@ export function computeXScale(options: XScaleOptions): Scale {
           range: [start, end],
         },
         {
-          bandwidth: bandwidth / totalBarsInCluster,
+          bandwidth: totalBarsInCluster > 0 ? bandwidth / totalBarsInCluster : bandwidth,
           minInterval,
           timeZone,
           totalBarsInCluster,