StackedBar

A stacked bar is a representation of data that uses rectangular bars to show the relative proportions of different categories.

Installation

To install @igloo-ui/stacked-bar in your project, you will need to run the following command using npm:

npm install @igloo-ui/stacked-bar

If you prefer Yarn, use the following command instead:

yarn add @igloo-ui/stacked-bar

Usage

Then to use the component in your code just import it!

import StackedBar from '@igloo-ui/stacked-bar';

<StackedBar
  dataSet={[
    {
      key: 'stronglyUnfavorable',
      label: 'Strongly Unfavorable',
      value: 30,
      strength: -2,
    },
    {
      key: 'unfavorable',
      label: 'Unfavorable',
      value: 10,
      strength: -1,
    },
    {
      key: 'neutral',
      label: 'Neutral',
      value: 20,
      strength: 0,
    },
    {
      key: 'favorable',
      label: 'Favorable',
      value: 15,
      strength: 1,
    },
    {
      key: 'stronglyFavorable',
      label: 'Strongly Favorable',
      value: 25,
      strength: 2,
    },
  ]}
  showValue
/>;