Show user flow in a sankey chart

[adriaandotcom]

Let's say we have this data:

referrer.hostname	referrer.path	hostname	path	country
example.com	/path1	example.com	/path2	NL
example.com	/path1	example.com	/path2	UK
google.com	/search	example.com	/path1	NL
google.com	/search	example.com	/path1	NL
google.com	/search	example.com	/path1	UK
duckduckgo.com	/search	example.com	/path1	NL
(empty)	(empty)	example.com	/path1	NL
(empty)	(empty)	example.com	/path2	NL

Make it like this:

from (5)	percentage	to
google.com	40% (2/5)	/path1 (4)
(direct)	20% (1/5)
duckduckgo.com	20% (1/5)
drop off	40% (2/5)
google.com	20% (1/5)	/path2 (1)

But then with multiple steps:

1. GA (dropoff & inject)	2. clean (only dropoff)	3. clean but boring
	)

I would love to have both dropoff and inject. Like Google Analytics. But screenshot "2. clean (only dropoff)" looks the best.

Mixpanel looks beautiful:

This looks nice as well (in D3):

Data for live example

```csv google.com,/landing1,10 duckduckgo.com,/landing1,1 duckduckgo.com,/landing1,5 google.com,/landing2,1 duckduckgo.com,/landing2,1 duckduckgo.com,/landing2,1 (direct),/landing1,2 others (50+),/landing1,5 others (50+),/landing2,4 /landing2,/path2,2 /landing1,/path2,4 /landing2,/path3,1 /landing1,/path4,3 ```

This seems ideal for landing pages. Howeever, is doesn't work well when you map out all pages. Use the data below:

Data that should be circular

```csv example.com,/path1,400 /path1,/path2,700 google.com,/path1,100 google.com,/path1,100 google.com,/path1,100 duckduckgo.com,/path1,100 (direct),/path1,100 (direct),/path2,100 /path2,path3,100 /path3,/path1,100 ```

The above data example should show circular data from /page3 to /page1:

But it does not.

There are two alternatives that do support circular links:

• https://github.com/tomshanley/d3-sankey-circular/
• https://github.com/ricklupton/d3-sankey-diagram