mode helix
NOW LIVEEmpower your end users with Explorations in Mode.Try it now

Funnel chart

Funnels can be helpful for visualizing a flow of things (users, people, organizations, etc.) through a sequential process, such as the sales pipeline.

Here's an example showing the count of companies receiving fundraising by series round.

View Mode Analysis

Click Results à la Mode to clone the report and build a funnel visualization with your data. Learn more about using HTML to customize your reports.

Create a funnel chart

Add the stylesheet link and script tags to the top of the HTML:

<link rel="stylesheet" href="https://mode.github.io/alamode/alamode.min.css">
<script src="https://cdn.rawgit.com/jakezatecky/d3-funnel/9afc292cced0024680e494a61d09f39abc20dc40/dist/d3-funnel.min.js"></script>
<script src="https://mode.github.io/alamode/alamode.min.js"></script>

Add the customizable snippet at the bottom of the HTML:

<script>

alamode.funnel(
  {
    query_name: "Startup Fundraising Round Funnel",
    stage_column: "completed_round",
    value_column: "company_count",
    title: "The startup fundraising funnel",
    height: 350,
    width: 500
  })

</script>

You can customize the funnel by editing the parameters in the snippet:

  • html_element: If not provided, the funnel will be added as the last element in the report. To place it elsewhere, select an element in your report with this parameter.
  • query_name: The name of the query that returns the chart's dataset. If you update the name of the query, you’ll need to update it here as well.
  • stage_column: The dataset column that defines the name of each stage in the funnel.
  • value_column: The dataset column that defines the value of each stage in the funnel.
  • title: The chart's title.
  • height: The height of the funnel in pixels.
  • width: The width of the funnel in pixels.
decorative particle

Get our weekly data newsletter

Work-related distractions for every data enthusiast.