Funnel charts

Funnels are a powerful analysis type that can be used to track the number of actors that fall off at each step in order to determine where a given flow loses the most users. To learn more about funnel analysis, check out our docs here.

You can create customizable funnel visualizations to display your data using our keen-analysis.js and keen-dataviz.js libraries.

Below are some examples of how you could customize your funnel charts and what the configuration would look like.

There are four types of funnel charts:

funnel

horizontal-funnel

Default configuration values:

  funnel: {
    lines: true, // separate each step with a line
    resultValues: true, // show or hide results
    percents: {
      show: false, // show and hide percents
      countingMethod: 'absolute', // 'absolute' - use the value of the first step to calculate the percentage change
                                  // 'relative' - use the value of the previous step to calculate the percentage change
      decimals: 0, // the number of decimal digits visible
    }
    hover: true, // show or hide hover effect
    marginBetweenSteps: false, // show or hide spaces between elements
  }

3D funnels are very similar to the default config values, except for some slight changes:

funnel-3d

  funnel: {
    marginBetweenSteps: false, // N/A
    effect3d: 'both-sides' // 'both-sides' - showing shades on both sides
                           // 'left' - showing shades on left side
                           // 'right' - showing shades on right side
  }

horizontal-funnel-3d

  funnel: {
    marginBetweenSteps: false, // N/A
    effect3d: 'both-sides' // 'both-sides' - showing shades on top and bottom
                           // 'top' - showing shades on top
                           // 'right' - showing shades on bottom
  }