Donut Charts

Design → https://www.figma.com/file/IdaocPKZYLeadqsWjgIVn8/IFES---Visual-Design---Production?node-id=3450%3A64831

Reference materials:

Donut Chart demo https://www.amcharts.com/demos/donut-chart/

Donut Chart with label in the center https://www.amcharts.com/demos/animated-time-line-pie-chart/

https://www.amcharts.com/docs/v4/tutorials/dealing-with-piechart-labels-that-dont-fit/

https://www.amcharts.com/docs/v4/tutorials/sum-label-inside-a-donut-chart/

Setting color scheme for charts https://www.amcharts.com/docs/v4/concepts/colors/#XY_Chart_and_derivative_charts

Color palette for charts

 

Acceptance Criteria

"Donut Charts" module is themed according to the styleguide and is responsive

Editors will be able to add one or more donut charts. If an odd number of charts is added (one, three, five), the odd chart is centered on screen.

charts use primary color palette - attached to description

module is added to accessibility scanner and is passing stats

Optional Chart Title
Optional Chart Title
Optional title