feat: add stacking positive and mixed values in stacked area (#105)

* refactor: update data for stacked area chart * feat: add support stacking positive and mixed values * refactor: remove data from mock * refactor: simpify if condition
gravity-ui · Dec 19, 2022 · 3f0cc62 · 3f0cc62
1 parent 3793957
commit 3f0cc62
Show file tree

Hide file tree

Showing 2 changed files with 176 additions and 28 deletions.
diff --git a/src/plugins/highcharts/__stories__/mocks/area-stacked.ts b/src/plugins/highcharts/__stories__/mocks/area-stacked.ts
@@ -4,65 +4,217 @@ export const data: HighchartsWidgetData = {
     data: {
         graphs: [
             {
-                title: 'Appliances',
+                title: 'Sales',
+                tooltip: {
+                    chartKitFormatting: true,
+                    chartKitPrecision: 2,
+                },
+                data: [
+                    {
+                        y: 167387.5003761053,
+                    },
+                    {
+                        y: 107532.49998930097,
+                    },
+                    {
+                        y: 27119.399931907654,
+                    },
+                    {
+                        y: 203415.90024918318,
+                    },
+                    {
+                        y: 114882.00052642822,
+                    },
+                    {
+                        y: 328452.60130500793,
+                    },
+                    {
+                        y: 149529.49963378906,
+                    },
+                    {
+                        y: 16477.799976468086,
+                    },
+                    {
+                        y: 3024.2000015974045,
+                    },
+                    {
+                        y: 91708.29990947247,
+                    },
+                    {
+                        y: 12485.399973154068,
+                    },
+                    {
+                        y: 189239.5000743866,
+                    },
+                    {
+                        y: 78483.89996623993,
+                    },
+                    {
+                        y: 330018.3997364044,
+                    },
+                    {
+                        y: 223844.49978113174,
+                    },
+                    {
+                        y: 46673.600484371185,
+                    },
+                    {
+                        y: 206966.50039672852,
+                    },
+                ],
+                legendTitle: 'Sales',
+                connectNulls: false,
+                yAxis: 0,
+                color: '#8AD554',
+            },
+            {
+                title: 'Profit',
                 tooltip: {
                     chartKitFormatting: true,
                     chartKitPrecision: 0,
                 },
                 data: [
                     {
-                        y: 2420,
-                        x: 2014,
+                        y: 41615,
+                    },
+                    {
+                        y: 17927,
+                    },
+                    {
+                        y: 6156,
+                    },
+                    {
+                        y: 29550,
+                    },
+                    {
+                        y: -3568,
+                    },
+                    {
+                        y: 26316,
+                    },
+                    {
+                        y: 55618,
+                    },
+                    {
+                        y: 6849,
+                    },
+                    {
+                        y: 850,
+                    },
+                    {
+                        y: 12649,
                     },
                     {
-                        y: 2472,
-                        x: 2015,
+                        y: 5367,
                     },
                     {
-                        y: 5248,
-                        x: 2016,
+                        y: 3353,
                     },
                     {
-                        y: 7787,
-                        x: 2017,
+                        y: 33437,
+                    },
+                    {
+                        y: 44171,
+                    },
+                    {
+                        y: 20907,
+                    },
+                    {
+                        y: -1262,
+                    },
+                    {
+                        y: -17865,
                     },
                 ],
-                legendTitle: 'Appliances',
+                legendTitle: 'Profit',
                 connectNulls: false,
                 yAxis: 0,
                 color: '#FF3D64',
             },
             {
-                title: 'Bookcases',
+                title: 'Px2',
                 tooltip: {
                     chartKitFormatting: true,
                     chartKitPrecision: 0,
                 },
                 data: [
                     {
-                        y: -363,
-                        x: 2014,
+                        y: 83230,
+                    },
+                    {
+                        y: 35854,
+                    },
+                    {
+                        y: 12312,
                     },
                     {
-                        y: -2777,
-                        x: 2015,
+                        y: 59100,
                     },
                     {
-                        y: 1880,
-                        x: 2016,
+                        y: -7136,
                     },
                     {
-                        y: -616,
-                        x: 2017,
+                        y: 52632,
+                    },
+                    {
+                        y: 111236,
+                    },
+                    {
+                        y: 13698,
+                    },
+                    {
+                        y: 1700,
+                    },
+                    {
+                        y: 25298,
+                    },
+                    {
+                        y: 10734,
+                    },
+                    {
+                        y: 6706,
+                    },
+                    {
+                        y: 66874,
+                    },
+                    {
+                        y: 88342,
+                    },
+                    {
+                        y: 41814,
+                    },
+                    {
+                        y: -2524,
+                    },
+                    {
+                        y: -35730,
                     },
                 ],
-                legendTitle: 'Bookcases',
+                legendTitle: 'Px2',
                 connectNulls: false,
                 yAxis: 0,
-                color: '#8AD554',
+                color: '#4DA2F1',
             },
         ],
-        categories: ['2014', '2015', '2016', '2017'],
+        categories: [
+            'Accessories',
+            'Appliances',
+            'Art',
+            'Binders',
+            'Bookcases',
+            'Chairs',
+            'Copiers',
+            'Envelopes',
+            'Fasteners',
+            'Furnishings',
+            'Labels',
+            'Machines',
+            'Paper',
+            'Phones',
+            'Storage',
+            'Supplies',
+            'Tables',
+        ],
     },
     config: {
         withoutLineLimit: true,

diff --git a/src/plugins/highcharts/renderer/helpers/config/config.js b/src/plugins/highcharts/renderer/helpers/config/config.js
@@ -1948,12 +1948,8 @@ export function prepareConfig(data, options, isMobile, holidays) {
                     false,
                 );
 
-                if (serieHasIntersectionWithOthers) {
-                    if (hasPositiveValues && !hasNegativeValues) {
-                        serie.stack = 'positive';
-                    } else if (!hasPositiveValues && hasNegativeValues) {
-                        serie.stack = 'negative';
-                    }
+                if (serieHasIntersectionWithOthers && !hasPositiveValues && hasNegativeValues) {
+                    serie.stack = 'negative';
                 }
             }
         });