From fed5fc4b81b7b97118e22d8c186f37ed6af23995 Mon Sep 17 00:00:00 2001 From: ByronBecker Date: Fri, 22 Mar 2019 11:12:28 -0700 Subject: [PATCH] feat(sankey): add ability to sort nodes (#401) --- packages/sankey/index.d.ts | 2 ++ packages/sankey/package.json | 2 +- packages/sankey/src/Sankey.js | 3 +++ packages/sankey/stories/sankey.stories.js | 10 ++++++++++ yarn.lock | 16 ++++++++++------ 5 files changed, 26 insertions(+), 7 deletions(-) diff --git a/packages/sankey/index.d.ts b/packages/sankey/index.d.ts index f8de5e7e2..624def5cd 100644 --- a/packages/sankey/index.d.ts +++ b/packages/sankey/index.d.ts @@ -76,6 +76,8 @@ declare module '@nivo/sankey' { theme: Theme legends: LegendProps[] + + sort?: (nodeA: SankeyDataNode, nodeB: SankeyDataNode) => number }> interface Dimensions { diff --git a/packages/sankey/package.json b/packages/sankey/package.json index 60b7ce67d..6abc5d46c 100644 --- a/packages/sankey/package.json +++ b/packages/sankey/package.json @@ -25,7 +25,7 @@ "dependencies": { "@nivo/core": "0.53.0", "@nivo/legends": "0.53.0", - "d3-sankey": "^0.7.1", + "d3-sankey": "0.12.1", "lodash": "^4.17.4", "react-motion": "^0.5.2", "recompose": "^0.30.0" diff --git a/packages/sankey/src/Sankey.js b/packages/sankey/src/Sankey.js index 0f7ef5342..2b4ee2b31 100644 --- a/packages/sankey/src/Sankey.js +++ b/packages/sankey/src/Sankey.js @@ -74,8 +74,11 @@ const Sankey = ({ tooltipFormat, legends, + + sort, }) => { const sankey = d3Sankey() + .nodeSort(sort) .nodeAlign(sankeyAlignmentFromProp(align)) .nodeWidth(nodeWidth) .nodePadding(nodePaddingY) diff --git a/packages/sankey/stories/sankey.stories.js b/packages/sankey/stories/sankey.stories.js index 0fbcd915f..203b1e767 100644 --- a/packages/sankey/stories/sankey.stories.js +++ b/packages/sankey/stories/sankey.stories.js @@ -86,3 +86,13 @@ const randColorProperties = { stories.add('with custom node & link coloring', () => ( node.nodeColor} /> )) + +const minNodeValueOnTop = (nodeA, nodeB) => { + if (nodeA.value < nodeB.value) return -1 + if (nodeA.value > nodeB.value) return 1 + return 0 +} + +stories.add('with reverse sort ordering (min node value on top)', () => ( + +)) diff --git a/yarn.lock b/yarn.lock index 18484473d..e44925e01 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4899,6 +4899,11 @@ d3-array@1, d3-array@^1.2.0: resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-1.2.4.tgz#635ce4d5eea759f6f605863dbcfc30edc737f71f" integrity sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw== +"d3-array@>=1 <=2": + version "2.0.3" + resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-2.0.3.tgz#9c0531eda701e416f28a030e3d4e6179ba74f19f" + integrity sha512-C7g4aCOoJa+/K5hPVqZLG8wjYHsTUROTk7Z1Ep9F4P5l+WVrvV0+6nAZ1wKTRLMhFWpGbozxUpyjIPZYAaLi+g== + d3-chord@^1.0.6: version "1.0.6" resolved "https://registry.yarnpkg.com/d3-chord/-/d3-chord-1.0.6.tgz#309157e3f2db2c752f0280fedd35f2067ccbb15f" @@ -4946,13 +4951,12 @@ d3-path@1: resolved "https://registry.yarnpkg.com/d3-path/-/d3-path-1.0.7.tgz#8de7cd693a75ac0b5480d3abaccd94793e58aae8" integrity sha512-q0cW1RpvA5c5ma2rch62mX8AYaiLX0+bdaSM2wxSU9tXjU4DNvkx9qiUvjkuWCj3p22UO/hlPivujqMiR9PDzA== -d3-sankey@^0.7.1: - version "0.7.1" - resolved "https://registry.yarnpkg.com/d3-sankey/-/d3-sankey-0.7.1.tgz#d229832268fc69a7fec84803e96c2256a614c521" - integrity sha1-0imDImj8aaf+yEgD6WwiVqYUxSE= +d3-sankey@0.12.1: + version "0.12.1" + resolved "https://registry.yarnpkg.com/d3-sankey/-/d3-sankey-0.12.1.tgz#f4a655227ee90211befcd32074aeb275e73f92ba" + integrity sha512-2DF8aj52Zkghfl06yCsCJUW/p8ChQND0+p1Xx3DiQIvABp4XazvyMAppgGRjJGwK2tkVYtpI1IgFIlMppBZMhg== dependencies: - d3-array "1" - d3-collection "1" + d3-array ">=1 <=2" d3-shape "^1.2.0" d3-scale-chromatic@^1.3.3: