fix(react-charting): Making the tooltip optional (#33807)

Author: srmukher

change/@fluentui-react-charting-7bbc396f-ab57-4884-9e21-e17cbbf30e8a.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Making the tooltip optional",
+  "packageName": "@fluentui/react-charting",
+  "email": "120183316+srmukher@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

packages/charts/react-charting/src/components/CommonComponents/CartesianChart.base.tsx

@@ -555,6 +555,7 @@ export class CartesianChartBase
                 maxWidth={xAxisTitleMaximumAllowedWidth}
                 wrapContent={wrapContent}
                 theme={this.props.theme}
+                showBackground={true}
               />
             )}
             <g
@@ -604,6 +605,7 @@ export class CartesianChartBase
                     maxWidth={yAxisTitleMaximumAllowedHeight}
                     wrapContent={wrapContent}
                     theme={this.props.theme}
+                    showBackground={true}
                   />
                 )}
               </g>
@@ -628,6 +630,7 @@ export class CartesianChartBase
                 maxWidth={yAxisTitleMaximumAllowedHeight}
                 wrapContent={wrapContent}
                 theme={this.props.theme}
+                showBackground={true}
               />
             )}
           </svg>

packages/charts/react-charting/src/components/DeclarativeChart/__snapshots__/DeclarativeChartRTL.test.tsx.snap

@@ -4167,13 +4167,6 @@ exports[`DeclarativeChart Should render gaugechart in DeclarativeChart 1`] = `
             />
           </g>
           <g>
-            <rect
-              fill="#ffffff"
-              height="8"
-              width="8"
-              x="-4"
-              y="-4"
-            />
             <text
               aria-hidden="true"
               class=
@@ -4193,12 +4186,6 @@ exports[`DeclarativeChart Should render gaugechart in DeclarativeChart 1`] = `
               420
             </text>
           </g>
-          <rect
-            height="8"
-            width="8"
-            x="-4"
-            y="-4"
-          />
           <text
             class=
 

packages/charts/react-charting/src/components/GaugeChart/GaugeChart.base.tsx

@@ -317,7 +317,6 @@ export class GaugeChartBase extends React.Component<IGaugeChartProps, IGaugeChar
                   }}
                   maxWidth={this._innerRadius * 2 - 24}
                   wrapContent={this._wrapContent}
-                  theme={this.props.theme}
                 />
               </g>
               {this.props.sublabel && (