# Funnel chart

> Stages with their counts and the conversion between them.

Source: https://82chart.com/en/docs/funnel/

`type: 'funnel'` draws the values of the first series as stages. Bar width is the value against the largest stage; between stages sits the conversion from the previous one (`↓ 44.7%`), and on the right the value and its share of the first stage.

```js
createChart('#chart', {
  type: 'funnel',
  title: 'Purchase funnel',
  data: {
    labels: ['Visit', 'View product', 'Add to cart', 'Checkout', 'Purchase'],
    series: [{ name: 'Users', data: [48210, 21530, 8240, 4910, 3120] }],
  },
});
```

- Tooltip: the stage value, **Conversion** (from the previous stage) and **Of first stage**.
- Keyboard: up and down move between stages.
- Stages keep the order you pass them in; a stage that grows is drawn as is (conversion above 100%).
