From 02fd4137265c85a0d76097a5922d21b245c688eb Mon Sep 17 00:00:00 2001
From: "Atishay Jain (atisjai)" <atishay.jain@microsoft.com>
Date: Fri, 16 Sep 2022 19:25:45 +0530
Subject: [PATCH 1/2] Fix multi stacked bar chart min width

---
 .../MultiStackedBarChart.base.tsx             | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/packages/react-charting/src/components/StackedBarChart/MultiStackedBarChart.base.tsx b/packages/react-charting/src/components/StackedBarChart/MultiStackedBarChart.base.tsx
index 234b9cd05adea..523d5f5d84d9c 100644
--- a/packages/react-charting/src/components/StackedBarChart/MultiStackedBarChart.base.tsx
+++ b/packages/react-charting/src/components/StackedBarChart/MultiStackedBarChart.base.tsx
@@ -140,6 +140,22 @@ export class MultiStackedBarChartBase extends React.Component<IMultiStackedBarCh
       0,
     );
 
+    let sumOfPercent = 0;
+    data.chartData!.map((point: IChartDataPoint, index: number) => {
+      const pointData = point.data ? point.data : 0;
+      value = (pointData / total) * 100 ? (pointData / total) * 100 : 0;
+      if (value < 1 && value !== 0) {
+        value = 1;
+      } else if (value > 99 && value !== 100) {
+        value = 99;
+      }
+      sumOfPercent += value;
+
+      return sumOfPercent;
+    });
+
+    const scalingRatio = sumOfPercent !== 0 ? sumOfPercent / 100 : 1;
+
     let prevPosition = 0;
     let value = 0;
 
@@ -154,6 +170,13 @@ export class MultiStackedBarChartBase extends React.Component<IMultiStackedBarCh
         prevPosition += value;
       }
       value = (pointData / total) * 100 ? (pointData / total) * 100 : 0;
+      if (value < 1 && value !== 0) {
+        value = 1 / scalingRatio;
+      } else if (value > 99 && value !== 100) {
+        value = 99 / scalingRatio;
+      } else {
+        value = value / scalingRatio;
+      }
 
       startingPoint.push(prevPosition);
 

From 2c1e6404ac3fe91716fd162539bfe188ed03da7d Mon Sep 17 00:00:00 2001
From: "Atishay Jain (atisjai)" <atishay.jain@microsoft.com>
Date: Fri, 16 Sep 2022 19:27:24 +0530
Subject: [PATCH 2/2] Add change file

---
 ...eact-charting-3df6df5e-105a-42a8-813e-82c2bb4f5eef.json | 7 +++++++
 1 file changed, 7 insertions(+)
 create mode 100644 change/@fluentui-react-charting-3df6df5e-105a-42a8-813e-82c2bb4f5eef.json

diff --git a/change/@fluentui-react-charting-3df6df5e-105a-42a8-813e-82c2bb4f5eef.json b/change/@fluentui-react-charting-3df6df5e-105a-42a8-813e-82c2bb4f5eef.json
new file mode 100644
index 0000000000000..3442d63093ba0
--- /dev/null
+++ b/change/@fluentui-react-charting-3df6df5e-105a-42a8-813e-82c2bb4f5eef.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Fix multi stacked bar chart min width",
+  "packageName": "@fluentui/react-charting",
+  "email": "atishay.jain@microsoft.com",
+  "dependentChangeType": "patch"
+}