From b8238e0f6d886d5d5adab385bca9946dc1c83d61 Mon Sep 17 00:00:00 2001 From: Michael Potter Date: Wed, 10 Jan 2024 15:35:05 -0800 Subject: [PATCH 1/6] Allow end users to override the sankey link hover style by providing their own css styling --- src/traces/sankey/plot.js | 43 +++++++++++++++++++++++++++++++++------ 1 file changed, 37 insertions(+), 6 deletions(-) diff --git a/src/traces/sankey/plot.js b/src/traces/sankey/plot.js index 8907d1fc02f..7f32c87c635 100644 --- a/src/traces/sankey/plot.js +++ b/src/traces/sankey/plot.js @@ -10,6 +10,8 @@ var cn = require('./constants').cn; var _ = Lib._; +var linkStyleInitialized = false; + function renderableValuePresent(d) {return d !== '';} function ownTrace(selection, d) { @@ -62,9 +64,38 @@ function nodeNonHoveredStyle(sankeyNode, d, sankey) { } function linkHoveredStyle(d, sankey, visitNodes, sankeyLink) { - sankeyLink.style('fill-opacity', function(l) { + if (!linkStyleInitialized) { + // Figure out whether the user has provided their own sankey-link-hover style. + let styleExists = false; + for (let i=0; i Date: Wed, 10 Jan 2024 16:08:32 -0800 Subject: [PATCH 2/6] add a draftlogs entry --- draftlogs/6839_change.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 draftlogs/6839_change.md diff --git a/draftlogs/6839_change.md b/draftlogs/6839_change.md new file mode 100644 index 00000000000..6fe959ed85d --- /dev/null +++ b/draftlogs/6839_change.md @@ -0,0 +1 @@ +- Update Sankey trace to allow user-defined link hover style override [[#6839](https://github.com/plotly/plotly.js/pull/6839)] \ No newline at end of file From 5e2444bca824c9bbad34465ada99f2a6c8949fd1 Mon Sep 17 00:00:00 2001 From: Michael Potter Date: Wed, 10 Jan 2024 16:43:13 -0800 Subject: [PATCH 3/6] use 'var' instead of 'let' per ci/cd guide --- src/traces/sankey/plot.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/traces/sankey/plot.js b/src/traces/sankey/plot.js index 7f32c87c635..3adf98c0162 100644 --- a/src/traces/sankey/plot.js +++ b/src/traces/sankey/plot.js @@ -66,10 +66,10 @@ function nodeNonHoveredStyle(sankeyNode, d, sankey) { function linkHoveredStyle(d, sankey, visitNodes, sankeyLink) { if (!linkStyleInitialized) { // Figure out whether the user has provided their own sankey-link-hover style. - let styleExists = false; - for (let i=0; i Date: Wed, 10 Jan 2024 16:57:47 -0800 Subject: [PATCH 4/6] remove 'const' in favor of 'var' per CI/CD rules --- src/traces/sankey/plot.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/traces/sankey/plot.js b/src/traces/sankey/plot.js index 3adf98c0162..e4c8f4b78cd 100644 --- a/src/traces/sankey/plot.js +++ b/src/traces/sankey/plot.js @@ -68,7 +68,7 @@ function linkHoveredStyle(d, sankey, visitNodes, sankeyLink) { // Figure out whether the user has provided their own sankey-link-hover style. var styleExists = false; for (var i=0; i Date: Wed, 10 Jan 2024 18:28:03 -0800 Subject: [PATCH 5/6] adhere to style guide CI/CD feedback --- src/traces/sankey/plot.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/traces/sankey/plot.js b/src/traces/sankey/plot.js index e4c8f4b78cd..7fc0c4871d9 100644 --- a/src/traces/sankey/plot.js +++ b/src/traces/sankey/plot.js @@ -64,24 +64,24 @@ function nodeNonHoveredStyle(sankeyNode, d, sankey) { } function linkHoveredStyle(d, sankey, visitNodes, sankeyLink) { - if (!linkStyleInitialized) { + if(!linkStyleInitialized) { // Figure out whether the user has provided their own sankey-link-hover style. var styleExists = false; - for (var i=0; i Date: Fri, 12 Jan 2024 15:12:11 -0800 Subject: [PATCH 6/6] catch exceptions when trying to read access-restricted css files, and update test case to look for css styling --- src/traces/sankey/plot.js | 16 ++++++++++------ test/jasmine/tests/sankey_test.js | 4 ++-- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/src/traces/sankey/plot.js b/src/traces/sankey/plot.js index 7fc0c4871d9..b6bd948f8c7 100644 --- a/src/traces/sankey/plot.js +++ b/src/traces/sankey/plot.js @@ -68,14 +68,18 @@ function linkHoveredStyle(d, sankey, visitNodes, sankeyLink) { // Figure out whether the user has provided their own sankey-link-hover style. var styleExists = false; for(var i = 0; i < document.styleSheets.length; i++) { - var rules = document.styleSheets[i].cssRules; - for(var j = 0; j < rules.length; j++) { - if(rules[j].selectorText === '.sankey-link-hover') { - styleExists = true; - break; + try { + var rules = document.styleSheets[i].cssRules; + for(var j = 0; j < rules.length; j++) { + if(rules[j].selectorText === '.sankey-link-hover') { + styleExists = true; + break; + } } + if(styleExists) break; + } catch(e) { + // This particular style sheet cannot be accessed (due to CORS policy) } - if(styleExists) break; } // If not, insert a default one diff --git a/test/jasmine/tests/sankey_test.js b/test/jasmine/tests/sankey_test.js index 18506de1eee..65b0fc07cde 100644 --- a/test/jasmine/tests/sankey_test.js +++ b/test/jasmine/tests/sankey_test.js @@ -1087,7 +1087,7 @@ describe('sankey tests', function() { .filter(function(obj) { return obj.link.label === 'stream 1'; })[0].forEach(function(l) { - expect(l.style.fillOpacity).toEqual('0.4'); + expect(l.classList.contains('sankey-link-hover')).toBe(true); }); }).then(function() { mouseEvent('mouseout', 200, 250); @@ -1096,7 +1096,7 @@ describe('sankey tests', function() { .filter(function(obj) { return obj.link.label === 'stream 1'; })[0].forEach(function(l) { - expect(l.style.fillOpacity).toEqual('0.2'); + expect(l.classList.contains('sankey-link-hover')).toBe(false); }); }) .then(done, done.fail);