Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add support for additional Sankey diagram orientations #110

Closed
wants to merge 31 commits into from
Closed

Add support for additional Sankey diagram orientations #110

wants to merge 31 commits into from
+158 −61

Conversation

jayaddison
Copy link

Adds orientation-specific sankey generator constructors: sankeyTop (top-to-bottom), sankeyRight (left-to-right), sankeyBottom (bottom-to-top) and sankeyLeft (right-to-left).

A new function linkShape is exposed on the sankey generator which allows the caller to retrieve the 'correct' D3 link shape matching the orientation of the constructor.

This was developed against a working copy of https://github.com/LonnyGomes/sankey-diagram-poc, with one styling modification applied for vertical mode: updating text element positioning logic to improve readability.

Bottom-to-top
image

Top-to-bottom
image

Right-to-left
image

Left-to-right
image

Resolves #55.

Revives #71.

jayaddison and others added 30 commits January 8, 2020 14:22
@jayaddison
Remove horizontal-only assumption from filenames, exports
8de4751
@jayaddison
Add no-op library-internal 'horizontal' orientation
cc7805a
@jayaddison
Add and export 'vertical' orientation
ee1f37b
@jayaddison
Add linkShape utility function
a26355e
@jayaddison
Orient extents before calculating node positions
3f63c25
@jayaddison
Update README.
584ca50
@jayaddison
Remove ES6 destructuring assignments
d94e35c
@jayaddison
Rename {horizontal, vertical} -> {sankeyHorizontal, sankeyVertical}
9cfd337
@jayaddison
Add nodeOrientation function docs, rendered examples
bcdabc2
@jayaddison
Re-arrange README to improve diff clarity
66afca1
@jayaddison
Enable node re-orientation for individual axis values instead of co-o…
d49ea06 
…rdinate pairs
@jayaddison
Refactor: include concept of direction for orientation
58b77c6
@jayaddison
Add left & up orientations
bd170ab
@jayaddison
Ensure link width is positive
4aec193
@jayaddison
Implement orientation-specific rendering without collision detection
b8a5222
@jayaddison
Enable orientation-specific collision detection
0cf48c2
@jayaddison
Update README orientation documentation
331af05
@jayaddison
Revert "Ensure link width is positive"
0267ad8 
This reverts commit 4aec193.
@jayaddison
Nit: spacing consistency fixup
d813a6b
@jayaddison
Nit: rename variable z -> ymax to remove dimenson-name ambiguity
863b185
@jayaddison
Revert "Nit: spacing consistency fixup"
f603a6c 
This reverts commit d813a6b.
@jayaddison
Refactor:
5fbbf1b 
- Export per-orientation constructors (sankeyTop, ...)
- Rename alignment options (sankeyLeft -> sankeyAlignLeft, ...)
- Rename orient* functions and variables to transform*
- Move transformNodes function within Sankey class
- Remove orientation getter/setter
- Remove export of orientations
@jayaddison
Bounds checking: check both lower and upper bounds during node collis…
e70b772 
…ion resolution
@jayaddison
Merge branch 'collision-bounds-checking' into vertical-orientation
9d3dc99
@jayaddison
Update README
332e27b
@jayaddison
Nit: brevity during alignment checks
ac05124
@jayaddison
Nit: attempt to further clarify distinct variable names
898a673
@jayaddison
Rename variable: orient -> orientation
ebfda16
@jayaddison
Rename variables: ystart, yend -> yStart, yEnd
d674a34
@jayaddison @curran
Use 'const' declaration for static module-level variables
1968a46 
Co-authored-by: Curran Kelleher <[email protected]>
@jayaddison jayaddison mentioned this pull request Jun 10, 2022
Open
@curran
Copy link

curran commented Jun 22, 2022

LGTM!

@jayaddison
Copy link
Author

Thanks for the review @curran!

@jtfell
Copy link

jtfell commented Aug 3, 2022

I've successfully used this fork to create a vertical sankey - keen to see it merged so I can depend on the official d3-sankey package!

@jayaddison
Copy link
Author

Thanks @jtfell - there seems to be some consensus building that maintaining a fork with these changes would be more successful than getting them included in-library here.

I don't feel like I'd be an effective maintainer for a separate package (neither JavaScript nor diagramming are expertises of mine), and also I'd like to reduce the set of pull requests that I have open, so I'm going to close this.

As an alternative, it's possible to use SVG transformations (rotate(...), in particular) to present a horizontally-generated sankey as a vertical sankey.

@jayaddison jayaddison closed this Dec 29, 2022
@jayaddison jayaddison deleted the vertical-orientation branch December 29, 2022 17:51
@EricDuminil
Copy link

This looks great. Would it be possible to change the orientation independently for each node?

One source from the left, one sink to the right, and one sink to the bottom? https://datavizcatalogue.com/methods/images/anatomy/sankey_diagram.png

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Support multiple orientations?
4 participants
@jayaddison @curran @jtfell @EricDuminil