From 83f25af8ae955efceb13fae40c78ad6adf3c17d4 Mon Sep 17 00:00:00 2001 From: Antoine Roy-Gobeil Date: Mon, 9 Mar 2020 23:14:08 -0400 Subject: [PATCH 1/5] sankey: introduce node.customdata --- src/traces/sankey/attributes.js | 7 +++++++ src/traces/sankey/calc.js | 4 +++- src/traces/sankey/defaults.js | 1 + test/jasmine/tests/sankey_test.js | 5 +++-- 4 files changed, 14 insertions(+), 3 deletions(-) diff --git a/src/traces/sankey/attributes.js b/src/traces/sankey/attributes.js index f45acc67075..0316d637d10 100644 --- a/src/traces/sankey/attributes.js +++ b/src/traces/sankey/attributes.js @@ -128,6 +128,13 @@ var attrs = module.exports = overrideAll({ 'what is beneath the node.' ].join(' ') }, + customdata: { + valType: 'data_array', + editType: 'calc', + description: [ + 'Assigns extra data each node.' + ].join(' ') + }, line: { color: { valType: 'color', diff --git a/src/traces/sankey/calc.js b/src/traces/sankey/calc.js index 21514ec0c85..61f65e5032c 100644 --- a/src/traces/sankey/calc.js +++ b/src/traces/sankey/calc.js @@ -116,6 +116,7 @@ function convertToD3Sankey(trace) { // Process nodes var totalCount = nodeCount + groups.length; var hasNodeColorArray = isArrayOrTypedArray(nodeSpec.color); + var hasNodeCustomdataArray = isArrayOrTypedArray(nodeSpec.customdata); var nodes = []; for(i = 0; i < totalCount; i++) { if(!linkedNodes[i]) continue; @@ -126,7 +127,8 @@ function convertToD3Sankey(trace) { childrenNodes: [], pointNumber: i, label: l, - color: hasNodeColorArray ? nodeSpec.color[i] : nodeSpec.color + color: hasNodeColorArray ? nodeSpec.color[i] : nodeSpec.color, + customdata: hasNodeCustomdataArray ? nodeSpec.customdata[i] : nodeSpec.customdata }); } diff --git a/src/traces/sankey/defaults.js b/src/traces/sankey/defaults.js index 797a20ec986..4766f61f39d 100644 --- a/src/traces/sankey/defaults.js +++ b/src/traces/sankey/defaults.js @@ -50,6 +50,7 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout coerceNode('color', nodeOut.label.map(function(d, i) { return Color.addOpacity(defaultNodePalette(i), 0.8); })); + coerceNode('customdata'); // link attributes var linkIn = traceIn.link || {}; diff --git a/test/jasmine/tests/sankey_test.js b/test/jasmine/tests/sankey_test.js index 5f0f02e5c07..956b81b001a 100644 --- a/test/jasmine/tests/sankey_test.js +++ b/test/jasmine/tests/sankey_test.js @@ -816,6 +816,7 @@ describe('sankey tests', function() { it('should show the correct hover labels when hovertemplate is specified', function(done) { var gd = createGraphDiv(); var mockCopy = Lib.extendDeep({}, mock); + mockCopy.data[0].node.customdata = [0, 0, 0, 0, '15'] Plotly.plot(gd, mockCopy).then(function() { _hover(404, 302); @@ -836,7 +837,7 @@ describe('sankey tests', function() { // Test (node|link).hovertemplate .then(function() { return Plotly.restyle(gd, { - 'node.hovertemplate': 'hovertemplate
%{value}
%{value:0.2f}%{fullData.name}', + 'node.hovertemplate': 'hovertemplate
%{value}
%{value:0.2f}
%{customdata}%{fullData.name}', 'link.hovertemplate': 'hovertemplate
source: %{source.label}
target: %{target.label}
size: %{value:0.0f}TWh%{fullData.name}' }); }) @@ -844,7 +845,7 @@ describe('sankey tests', function() { _hover(404, 302); assertLabel( - [ 'hovertemplate', '447TWh', '447.48', 'trace 0'], + [ 'hovertemplate', '447TWh', '447.48', '15', 'trace 0'], ['rgb(148, 103, 189)', 'rgb(255, 255, 255)', 13, 'Arial', 'rgb(255, 255, 255)'] ); }) From 5a5db77b9f2bcf643236e4be51656fd38c5a32c9 Mon Sep 17 00:00:00 2001 From: Antoine Roy-Gobeil Date: Mon, 9 Mar 2020 23:29:22 -0400 Subject: [PATCH 2/5] sankey: introduce link.customdata --- src/traces/sankey/attributes.js | 7 +++++++ src/traces/sankey/calc.js | 2 ++ src/traces/sankey/defaults.js | 1 + test/jasmine/tests/sankey_test.js | 11 +++++++---- 4 files changed, 17 insertions(+), 4 deletions(-) diff --git a/src/traces/sankey/attributes.js b/src/traces/sankey/attributes.js index 0316d637d10..12be7c38c28 100644 --- a/src/traces/sankey/attributes.js +++ b/src/traces/sankey/attributes.js @@ -207,6 +207,13 @@ var attrs = module.exports = overrideAll({ 'If `link.color` is omitted, then by default, a translucent grey link will be used.' ].join(' ') }, + customdata: { + valType: 'data_array', + editType: 'calc', + description: [ + 'Assigns extra data each link.' + ].join(' ') + }, line: { color: { valType: 'color', diff --git a/src/traces/sankey/calc.js b/src/traces/sankey/calc.js index 61f65e5032c..84de346cdf8 100644 --- a/src/traces/sankey/calc.js +++ b/src/traces/sankey/calc.js @@ -22,6 +22,7 @@ function convertToD3Sankey(trace) { var links = []; var hasLinkColorArray = isArrayOrTypedArray(linkSpec.color); + var hasLinkCustomdataArray = isArrayOrTypedArray(linkSpec.customdata); var linkedNodes = {}; var components = {}; @@ -103,6 +104,7 @@ function convertToD3Sankey(trace) { pointNumber: i, label: label, color: hasLinkColorArray ? linkSpec.color[i] : linkSpec.color, + customdata: hasLinkCustomdataArray ? linkSpec.customdata[i] : linkSpec.customdata, concentrationscale: concentrationscale, source: source, target: target, diff --git a/src/traces/sankey/defaults.js b/src/traces/sankey/defaults.js index 4766f61f39d..9a73591eb12 100644 --- a/src/traces/sankey/defaults.js +++ b/src/traces/sankey/defaults.js @@ -74,6 +74,7 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout 'rgba(0, 0, 0, 0.2)'; coerceLink('color', Lib.repeat(defaultLinkColor, linkOut.value.length)); + coerceLink('customdata'); handleArrayContainerDefaults(linkIn, linkOut, { name: 'colorscales', diff --git a/test/jasmine/tests/sankey_test.js b/test/jasmine/tests/sankey_test.js index 956b81b001a..97c5007e910 100644 --- a/test/jasmine/tests/sankey_test.js +++ b/test/jasmine/tests/sankey_test.js @@ -816,7 +816,10 @@ describe('sankey tests', function() { it('should show the correct hover labels when hovertemplate is specified', function(done) { var gd = createGraphDiv(); var mockCopy = Lib.extendDeep({}, mock); - mockCopy.data[0].node.customdata = [0, 0, 0, 0, '15'] + mockCopy.data[0].node.customdata = []; + mockCopy.data[0].node.customdata[4] = 'nodeCustomdata'; + mockCopy.data[0].link.customdata = []; + mockCopy.data[0].link.customdata[61] = 'linkCustomdata'; Plotly.plot(gd, mockCopy).then(function() { _hover(404, 302); @@ -838,14 +841,14 @@ describe('sankey tests', function() { .then(function() { return Plotly.restyle(gd, { 'node.hovertemplate': 'hovertemplate
%{value}
%{value:0.2f}
%{customdata}%{fullData.name}', - 'link.hovertemplate': 'hovertemplate
source: %{source.label}
target: %{target.label}
size: %{value:0.0f}TWh%{fullData.name}' + 'link.hovertemplate': 'hovertemplate
source: %{source.label}
target: %{target.label}
size: %{value:0.0f}TWh
%{customdata}%{fullData.name}' }); }) .then(function() { _hover(404, 302); assertLabel( - [ 'hovertemplate', '447TWh', '447.48', '15', 'trace 0'], + [ 'hovertemplate', '447TWh', '447.48', 'nodeCustomdata', 'trace 0'], ['rgb(148, 103, 189)', 'rgb(255, 255, 255)', 13, 'Arial', 'rgb(255, 255, 255)'] ); }) @@ -853,7 +856,7 @@ describe('sankey tests', function() { _hover(450, 300); assertLabel( - ['hovertemplate', 'source: Solid', 'target: Industry', 'size: 46TWh', 'trace 0'], + ['hovertemplate', 'source: Solid', 'target: Industry', 'size: 46TWh', 'linkCustomdata', 'trace 0'], ['rgb(0, 0, 96)', 'rgb(255, 255, 255)', 13, 'Arial', 'rgb(255, 255, 255)'] ); }) From 63ef3e9fb7f42d82493b0b965c23b1aebdcb5d2a Mon Sep 17 00:00:00 2001 From: Antoine Roy-Gobeil Date: Tue, 10 Mar 2020 12:30:45 -0400 Subject: [PATCH 3/5] sankey: :hocho: top-level customdata --- src/traces/sankey/attributes.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/traces/sankey/attributes.js b/src/traces/sankey/attributes.js index 12be7c38c28..b3cc191cb5d 100644 --- a/src/traces/sankey/attributes.js +++ b/src/traces/sankey/attributes.js @@ -84,6 +84,9 @@ var attrs = module.exports = overrideAll({ description: 'Sets the font for node labels' }), + // Remove top-level customdata + customdata: undefined, + node: { label: { valType: 'data_array', From c43873a6a6eacef71764861f937a0810bb06f077 Mon Sep 17 00:00:00 2001 From: Antoine Roy-Gobeil Date: Tue, 10 Mar 2020 12:48:52 -0400 Subject: [PATCH 4/5] sankey: test multi-dimensional (node|link).customdata in hovertemplate --- test/jasmine/tests/sankey_test.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/test/jasmine/tests/sankey_test.js b/test/jasmine/tests/sankey_test.js index 97c5007e910..01ead26d544 100644 --- a/test/jasmine/tests/sankey_test.js +++ b/test/jasmine/tests/sankey_test.js @@ -817,9 +817,9 @@ describe('sankey tests', function() { var gd = createGraphDiv(); var mockCopy = Lib.extendDeep({}, mock); mockCopy.data[0].node.customdata = []; - mockCopy.data[0].node.customdata[4] = 'nodeCustomdata'; + mockCopy.data[0].node.customdata[4] = ['nodeCustomdata0', 'nodeCustomdata1']; mockCopy.data[0].link.customdata = []; - mockCopy.data[0].link.customdata[61] = 'linkCustomdata'; + mockCopy.data[0].link.customdata[61] = ['linkCustomdata0', 'linkCustomdata1']; Plotly.plot(gd, mockCopy).then(function() { _hover(404, 302); @@ -840,15 +840,15 @@ describe('sankey tests', function() { // Test (node|link).hovertemplate .then(function() { return Plotly.restyle(gd, { - 'node.hovertemplate': 'hovertemplate
%{value}
%{value:0.2f}
%{customdata}%{fullData.name}', - 'link.hovertemplate': 'hovertemplate
source: %{source.label}
target: %{target.label}
size: %{value:0.0f}TWh
%{customdata}%{fullData.name}' + 'node.hovertemplate': 'hovertemplate
%{value}
%{value:0.2f}
%{customdata[0]}/%{customdata[1]}%{fullData.name}', + 'link.hovertemplate': 'hovertemplate
source: %{source.label}
target: %{target.label}
size: %{value:0.0f}TWh
%{customdata[1]}%{fullData.name}' }); }) .then(function() { _hover(404, 302); assertLabel( - [ 'hovertemplate', '447TWh', '447.48', 'nodeCustomdata', 'trace 0'], + [ 'hovertemplate', '447TWh', '447.48', 'nodeCustomdata0/nodeCustomdata1', 'trace 0'], ['rgb(148, 103, 189)', 'rgb(255, 255, 255)', 13, 'Arial', 'rgb(255, 255, 255)'] ); }) @@ -856,7 +856,7 @@ describe('sankey tests', function() { _hover(450, 300); assertLabel( - ['hovertemplate', 'source: Solid', 'target: Industry', 'size: 46TWh', 'linkCustomdata', 'trace 0'], + ['hovertemplate', 'source: Solid', 'target: Industry', 'size: 46TWh', 'linkCustomdata1', 'trace 0'], ['rgb(0, 0, 96)', 'rgb(255, 255, 255)', 13, 'Arial', 'rgb(255, 255, 255)'] ); }) From c27ced00ff49be0f514b690576b78029b64adee6 Mon Sep 17 00:00:00 2001 From: Antoine Roy-Gobeil Date: Tue, 10 Mar 2020 17:15:43 -0400 Subject: [PATCH 5/5] sankey: fix typo in customdata's description --- src/traces/sankey/attributes.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/traces/sankey/attributes.js b/src/traces/sankey/attributes.js index b3cc191cb5d..94dd451bc5e 100644 --- a/src/traces/sankey/attributes.js +++ b/src/traces/sankey/attributes.js @@ -135,7 +135,7 @@ var attrs = module.exports = overrideAll({ valType: 'data_array', editType: 'calc', description: [ - 'Assigns extra data each node.' + 'Assigns extra data to each node.' ].join(' ') }, line: { @@ -214,7 +214,7 @@ var attrs = module.exports = overrideAll({ valType: 'data_array', editType: 'calc', description: [ - 'Assigns extra data each link.' + 'Assigns extra data to each link.' ].join(' ') }, line: {