This hybrid sankey diagram builds on the example found at http://www.d3noob.org/2013/02/sankey-diagrams-description-of-d3js-code.html .
It modifies the original sankey API found at: https://github.com/d3/d3-plugins/tree/master/sankey .
I imagine using it in a site visit mapping context, superceding the visit mapping found in products from that company in San Jose.
Share of visit traffic (for example, by device type) can be distinguished by link colors.
Types of page can be distinguished by node color, while the exact page name is given in the text.
In real life, you'll generate 10Ks of paths and paths of 100s of distinct node types easily. So you'll need to curate the nodes and links to a manageable set. Some python efforts to do that are in my repo at: https://github.com/mgoold/sankeyhybrid .
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"headermapping": {"primarydimension": "group:", "values": ["value"], "groups": ["month"]}, "data": [{"group": "A--B--C--D--E", "value": "40", "month": "1/1/16"}, {"group": "A--B", "value": "10", "month": "1/1/16"}, {"group": "C", "value": "15", "month": "1/1/16"}, {"group": "D", "value": "10", "month": "1/1/16"}, {"group": "B--D", "value": "5", "month": "1/1/16"}, {"group": "A--B--C--D", "value": "45", "month": "2/1/16"}, {"group": "A--B", "value": "15", "month": "2/1/16"}, {"group": "C", "value": "10", "month": "2/1/16"}, {"group": "D", "value": "10", "month": "2/1/16"}, {"group": "B--D", "value": "10", "month": "2/1/16"}], "maxcatstring": "A--B--C--D--E"} |