charting: Grouped vertical bar chart code refactor.

[jameelakowsar]

Pull request checklist

• Addresses an existing issue: Fixes #Grouped vertical bar chart: Refactoring of Groped vertical bar chart #15018, Charting: Unit test cases to the charts. #15577
• Include a change request file using $ yarn change

Description of changes

In the process of restructure of the Groped vertical bar chart,

• Removed d3 related graph structure and updated with rectangles.

• Implemented with Cartesian chart(Common component)

• YMinValue and YMaxValue support added

• Added support of yAxisTickFormat.

• Customized callout support implemented.

• Code cleanup

• Snapshot and basic level unit test cases added

• Deprecated below props(Made them as default props).

  - showYAxisGridLines
  - showXAxisPath
  - showYAxisPath
  - showXAxisGridLines
  - legendColor
  

Note: As RTL support and word wrap of x axis already implemented for this chart, Now it's working as like previous. Attacked screenshots.

Focus areas to test

Grouped vertical bar chart

Grouped vertical bar chart with custom callout

yMax value support - with 100000 as Max value

RTL Support

Test link: http://fabricweb.z5.web.core.windows.net/pr-deploy-site/refs/pull/15468/merge/charting/dist/index.html#/examples/GroupedVerticalBarChart

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 85928b9:

Sandbox	Source
Fluent UI Button	Configuration
codesandbox-react-template	Configuration

[msft-github-bot]

Perf Analysis

No significant results to display.

All results

Scenario	Render type	7.0 Ticks	PR Ticks	Iterations	Status
BaseButton	mount	924	927	5000
Breadcrumb	mount	39507	39256	5000
Checkbox	mount	1559	1671	5000
CheckboxBase	mount	1349	1308	5000
ChoiceGroup	mount	5048	5057	5000
ComboBox	mount	910	884	1000
CommandBar	mount	7431	7371	1000
ContextualMenu	mount	12438	12562	1000
DefaultButton	mount	1163	1137	5000
DetailsRow	mount	3561	3622	5000
DetailsRowFast	mount	3583	3582	5000
DetailsRowNoStyles	mount	3392	3386	5000
Dialog	mount	1488	1480	1000
DocumentCardTitle	mount	1719	1776	1000
Dropdown	mount	2566	2626	5000
FocusTrapZone	mount	1718	1681	5000
FocusZone	mount	1763	1740	5000
IconButton	mount	1830	1800	5000
Label	mount	331	327	5000
Layer	mount	1939	1945	5000
Link	mount	443	439	5000
MenuButton	mount	1496	1516	5000
MessageBar	mount	1965	1998	5000
Nav	mount	3278	3256	1000
OverflowSet	mount	1398	1362	5000
Panel	mount	1401	1433	1000
Persona	mount	807	812	1000
Pivot	mount	1411	1421	1000
PrimaryButton	mount	1286	1294	5000
Rating	mount	7689	7786	5000
SearchBox	mount	1290	1312	5000
Shimmer	mount	2617	2656	5000
Slider	mount	1473	1505	5000
SpinButton	mount	5153	5009	5000
Spinner	mount	402	400	5000
SplitButton	mount	3333	3323	5000
Stack	mount	506	522	5000
StackWithIntrinsicChildren	mount	1527	1540	5000
StackWithTextChildren	mount	4908	4891	5000
SwatchColorPicker	mount	10448	10527	5000
TagPicker	mount	2849	2859	5000
TeachingBubble	mount	47674	47726	5000
Text	mount	433	438	5000
TextField	mount	1418	1458	5000
Toggle	mount	816	829	5000
button	mount	101	101	5000

[size-auditor]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: e631d61d95d145043bfa3f08ae0b4a1ae0bf8d5a (build)

[khmakoto]

Now that we're publishing beta versions of 8.0 please also port this to the master branch once it merges.

[msft-github-bot]

🎉@fluentui/react-examples@v0.8.7 has been released which incorporates this pull request.:tada:

Handy links:

• Release Notes
• Official NPM Release

[msft-github-bot]

🎉@uifabric/charting@v4.9.0 has been released which incorporates this pull request.:tada:

Handy links:

• Release Notes
• Official NPM Release

[kubkon]

cc @ecraig12345: Ported to v8 in #15838