Funnel treatments
Ten ways to draw the same funnel. G to J come from charting libraries;
A to F are hand-drawn. Identical data in each: 99 members given
access, 40 opened it, 18 delivered a rollout, 12 came back in a later
week. Pick the one that reads best.
G
Apache ECharts funnel series
Not hand-drawn. This is the library's own funnel type, themed to our
palette. It brings smoothing, gaps, borders, label placement and
hover for free, and is the same series the app could use.
H
ECharts, pyramid
Same library, inverted. The widest stage at the bottom reads as
accumulation rather than loss, which suits "how many got all the way
through" better than a draining funnel does.
I
Plotly funnelarea
A different trace type entirely: area-encoded trapezoids packed
tight with no gaps, so it reads as one solid shape. Plotly is a 4.6
MB bundle, which is the catch.
J
amCharts 5 funnel
The most finished of the set out of the box, with real label
leader-lines. Licensing is the catch: the free tier requires an
amCharts attribution link on the page, otherwise it is a paid
licence.
F
Solid, with depth
One dark silhouette of the whole funnel, shifted down and right,
with the bands sitting on top. The dark shows along the edge and
through the gaps, which gives depth without any extra shapes to go
wrong. Our own purple, fixed geometry, card-sized.
E
Layered, with a rim
Each stage is a slice with its own elliptical rim, which is what
gives the shape depth instead of reading as flat trapezoids.
Numbered stages down the left, figures and drop-off to the right.
A
Stepped, with gaps
Separated bands rather than one solid wedge. The gaps stop the tail
collapsing into a spike and give each stage its own weight.
B
With drop-off arms
The people who stop peel off to the side instead of just vanishing,
so the funnel shows both what carried on and what was lost.
C
Chevrons
Each stage points at the next. Bolder and more poster-like, and the
arrow does the work of implying sequence rather than the taper.
D
Horizontal
The same taper turned on its side, reading left to right like the
rest of the dashboard. Wide stages give the labels room and the card
stays short.