带R（或相关）的冲积图

Question

In a survey I asked two question:

1. What is your main transportation?(only 1 possible answer and mandatory answer)
2. What is your secondary transportation? (0 or many answer, each secondary transport contains 0 for yes and 1 for no)

Here are some fake data: http://pastebin.com/raw.php?i=pp1EHP7r

PersonNumber,Main Transport,Bus(secondary transport),Metro(secondary transport),Tram (secondary transport)
1,Bus,1,0,1
2,Bus,1,0,1
3,Bus,1,1,1
4,Train,1,0,0
5,Train,0,1,0
6,Train,0,1,0
7,Bus,0,0,0
8,Bus,0,1,0
9,Metro,0,1,0

My aim is to create two parts The left part with the main transports. The right part with secondary transport. Then the left tranport link the right one if there is the value one on the right column. For instance for the first observation : Bus will be linked to Bus(secondary transport) and to Tram (secondary transport) but not to Metro(secondary transport)

I really don't know how to do it because one main transport needs to be connected to many other columns only if values contains 1...

I'm looking for that kind of graph flow http://app.raw.densitydesign.org/#/

Answer 1

If you want to visualize it using Raw ( http://app.raw.densitydesign.org/#/ ) you have to create a dataset like this (created starting from your data):

PersonNumber    MainTransport   SecondaryTransport
1   Bus Bus
1   Bus Tram
2   Bus Bus
2   Bus Tram
3   Bus Bus
3   Bus Tram
3   Bus Metro
4   Train   Bus
5   Train   Metro
6   Train   Metro
8   Bus Metro
9   Metro   Metro

Each line represents a connection between main transport and secondary transport. If a person uses more than one secondary transport, you must create a line for each couple of primary/secondary transport (see person #3). Be aware that as each line have the same visual weight, the total height of the fluxes represents the number of each variable occurrences.

In Raw drag "MainTransport" and "SecondaryTransport" as "Dimensions".

Answer 2

If you want to add color to the graph you need to modify alluvial.js by swapping the color variable:

color = d3.scale.category20();

Then it works like a charm!

Rob