8000 Don't mutate colorscale, cmin/cmax and zmin/zmax into user traces by etpinard · Pull Request #3341 · plotly/plotly.js · GitHub
[go: up one dir, main page]
Skip to content

Don't mutate colorscale, cmin/cmax and zmin/zmax into user traces #3341

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

Merged
merged 12 commits into from
Dec 17, 2018
Merged

Don't mutate colorscale, cmin/cmax and zmin/zmax into user traces #3341

Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
8046bb6
move all colorscale helpers to ./helpers.js and ./scales.js
etpinard Dec 13, 2018
0a686dd
flip scale when reversescale:true just before making scaleFn
etpinard Dec 13, 2018
c9d92d7
fixes #3273 - add Colorscale.crossTraceDefaults
etpinard Dec 14, 2018
39639c0
:hocho: now unused updateStyle method in transformed full traces
etpinard Dec 14, 2018
a6517a8
add a :boat: load of auto-colorscale tests
etpinard Dec 17, 2018
6a47d66
fixes #3100 - make colorscales work from templates
etpinard Dec 17, 2018
e8973fa
closes #2873 - add line colorscale + markers mock
etpinard Dec 17, 2018
73c66a9
:hocho: obsolete comment
etpinard Dec 17, 2018
175626b
fix legend items of marker.colorscale traces
etpinard Dec 17, 2018
fc884a7
fix baselines that suffer from erroneous colorscale.slice()
etpinard Dec 17, 2018
7c21eab
fixup variable names for consistency
etpinard Dec 17, 2018
596bb47
improve gl3d line colorscales with markers mock
etpinard Dec 17, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
add a ⛵ load of auto-colorscale tests
  • Loading branch information
@etpinard
etpinard committed Dec 17, 2018
commit a6517a87583cb515b3ebbe9acfea3843f320eab4
293 changes: 293 additions & 0 deletions test/jasmine/tests/colorscale_test.js
View file
Open in desktop
10000
Original file line number Diff line number Diff line change
@@ -1,9 +1,16 @@
var Plotly = require('@lib');

var Colorscale = require('@src/components/colorscale');

var Lib = require('@src/lib');
var Plots = require('@src/plots/plots');
var Heatmap = require('@src/traces/heatmap');
var Scatter = require('@src/traces/scatter');

var d3 = require('d3');
var createGraphDiv = require('../assets/create_graph_div');
var destroyGraphDiv = require('../assets/destroy_graph_div');
var failTest = require('../assets/fail_test');
var supplyAllDefaults = require('../assets/supply_defaults');

function _supply(trace, layout) {
Expand Down Expand Up @@ -571,3 +578,289 @@ describe('Test colorscale:', function() {
});
});
});

describe('Test colorscale restyle calls:', function() {
var gd;

beforeEach(function() {
gd = createGraphDiv();
});

afterEach(destroyGraphDiv);

function getFill(q) {
return d3.select(q).node().style.fill;
}

it('should be able to toggle between autocolorscale true/false and set colorscales (contour case)', function(done) {
function _assert(msg, exp) {
var cc = [];
cc.push(getFill('.contourbg > path'));
d3.selectAll('.contourfill > path').each(function() {
cc.push(getFill(this));
});
expect(cc).toEqual(exp.contourColors);

expect(gd._fullData[0].colorscale).toEqual(exp.colorscale);
expect(gd._fullData[0].autocolorscale).toBe(exp.autocolorscale, msg);

expect(gd.data[0].colorscale).toEqual(exp.colorscaleIn);
expect(gd.data[0].autocolorscale).toBe(exp.autocolorscaleIn, msg);
}

// update via, assert then assert again (and again ;) after non-calc edits
function _run(msg, restyleObj, exp) {
return Plotly.restyle(gd, restyleObj)
.then(function() { _assert(msg, exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.range', [-1, 5]); })
.then(function() { _assert(msg + ' after axrange relayout', exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.autorange', true); })
.then(function() { _assert(msg + ' after autorange', exp); })
.then(function() { return Plotly.restyle(gd, 'contours.showlines', true); })
.then(function() { _assert(msg + ' after contours.showlines restyle', exp); })
.then(function() { return Plotly.restyle(gd, 'contours.showlines', false); })
.then(function() { _assert(msg + ' back to original contours.showlines', exp); });
}

var rdbu = ['rgb(5, 10, 172)', 'rgb(190, 190, 190)', 'rgb(178, 10, 28)'];
var reds = ['rgb(220, 220, 220)', 'rgb(234, 135, 92)', 'rgb(178, 10, 28)'];
var grns = ['rgb(0, 68, 27)', 'rgb(116, 196, 118)', 'rgb(247, 252, 245)'];

Plotly.plot(gd, [{
type: 'contour',
z: [
[1, 20, 30],
[20, 1, 60],
[30, 60, 1]
],
ncontours: 3
}])
.then(function() {
_assert('base (autocolorscale:false by dflt)', {
contourColors: rdbu,
autocolorscale: false,
autocolorscaleIn: undefined,
colorscale: Colorscale.scales.RdBu,
colorscaleIn: undefined
});
})
.then(function() {
return _run('restyle to autocolorscale:true', {autocolorscale: true}, {
contourColors: reds,
autocolorscale: true,
autocolorscaleIn: true,
colorscale: Colorscale.scales.Reds,
colorscaleIn: undefined
});
})
.then(function() {
return _run('restyle to reversescale:true with autocolorscale:true', {reversescale: true}, {
contourColors: reds.slice().reverse(),
autocolorscale: true,
autocolorscaleIn: true,
colorscale: Colorscale.scales.Reds,
colorscaleIn: undefined
});
})
.then(function() {
return _run('restyle back to autocolorscale:false with reversescale:true', {autocolorscale: false}, {
contourColors: rdbu.slice().reverse(),
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.RdBu,
colorscaleIn: undefined
});
})
.then(function() {
return _run('restyle to *Greens* colorscale', {colorscale: 'Greens', reversescale: false}, {
contourColors: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('restyle back again to autocolorscale:true', {autocolorscale: true}, {
contourColors: reds,
autocolorscale: true,
autocolorscaleIn: true,
colorscale: Colorscale.scales.Reds,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('restyle back to autocolorscale:false with colorscale:Greens', {autocolorscale: false}, {
contourColors: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.catch(failTest)
.then(done);
});

it('should be able to toggle between autocolorscale true/false and set colorscales (scatter marker case)', function(done) {
function _assert(msg, exp) {
var mcc = [];
d3.selectAll('path.point').each(function() {
mcc.push(getFill(this));
});
expect(mcc).toEqual(exp.mcc);

expect(gd._fullData[0].marker.colorscale).toEqual(exp.colorscale);
expect(gd._fullData[0].marker.autocolorscale).toBe(exp.autocolorscale, msg);

expect(gd.data[0].marker.colorscale).toEqual(exp.colorscaleIn);
expect(gd.data[0].marker.autocolorscale).toBe(exp.autocolorscaleIn, msg);
}

// update via, assert then assert again (and again ;) after non-calc edits
function _run(msg, restyleObj, exp) {
return Plotly.restyle(gd, restyleObj)
.then(function() { _assert(msg, exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.range', [-1, 5]); })
.then(function() { _assert(msg + ' after axrange relayout', exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.autorange', true); })
.then(function() { _assert(msg + ' after autorange', exp); })
.then(function() { return Plotly.restyle(gd, 'marker.symbol', 'square'); })
.then(function() { _assert(msg + ' after marker.symbol restyle', exp); })
.then(function() { return Plotly.restyle(gd, 'marker.symbol', null); })
.then(function() { _assert(msg + ' back to original marker.symbol', exp); });
}

var rdbu = ['rgb(5, 10, 172)', 'rgb(77, 101, 226)', 'rgb(178, 10, 28)'];
var grns = ['rgb(0, 68, 27)', 'rgb(35, 139, 69)', 'rgb(247, 252, 245)'];

Plotly.plot(gd, [{
mode: 'markers',
y: [1, 2, 3],
marker: {color: [-1, 0, 3]}
}])
.then(function() {
_assert('base (autocolorscale:true by dflt)', {
mcc: rdbu,
autocolorscale: true,
autocolorscaleIn: undefined,
colorscale: Colorscale.scales.RdBu,
colorscaleIn: undefined
});
})
.then(function() {
return _run('set *Greens* colorscale', {'marker.colorscale': 'Greens'}, {
mcc: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('back to autocolorscale:true', {'marker.autocolorscale': true}, {
mcc: rdbu,
autocolorscale: true,
autocolorscaleIn: true,
colorscale: Colorscale.scales.RdBu,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('back to autocolorscale:false w/ colorscale set', {'marker.autocolorscale': false}, {
mcc: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.catch(failTest)
.then(done);
});

it('should be able to toggle between autocolorscale true/false and set colorscales (scatter marker line case)', function(done) {
var mlw0 = 5;

function _assert(msg, exp) {
var mlcc = [];
d3.selectAll('path.point').each(function() {
mlcc.push(d3.select(this).node().style.stroke);
});
expect(mlcc).toEqual(exp.mlcc);

expect(gd._fullData[0].marker.line.colorscale).toEqual(exp.colorscale);
expect(gd._fullData[0].marker.line.autocolorscale).toBe(exp.autocolorscale, msg);

expect(gd.data[0].marker.line.colorscale).toEqual(exp.colorscaleIn);
expect(gd.data[0].marker.line.autocolorscale).toBe(exp.autocolorscaleIn, msg);
}

// update via, assert then assert again (and again ;) after non-calc edits
function _run(msg, restyleObj, exp) {
return Plotly.restyle(gd, restyleObj)
.then(function() { _assert(msg, exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.range', [-1, 5]); })
.then(function() { _assert(msg + ' after axrange relayout', exp); })
.then(function() { return Plotly.relayout(gd, 'xaxis.autorange', true); })
.then(function() { _assert(msg + ' after autorange', exp); })
.then(function() { return Plotly.restyle(gd, 'marker.line.width', 10); })
.then(function() { _assert(msg + ' after marker lw restyle', exp); })
.then(function() { return Plotly.restyle(gd, 'marker.line.width', mlw0); })
.then(function() { _assert(msg + ' back to original marker lw', exp); });
}

var blues = ['rgb(220, 220, 220)', 'rgb(70, 100, 245)', 'rgb(5, 10, 172)'];
var grns = ['rgb(247, 252, 245)', 'rgb(116, 196, 118)', 'rgb(0, 68, 27)'];

Plotly.plot(gd, [{
mode: 'markers',
y: [1, 2, 3],
marker: {
size: 20,
line: {
color: [-1, -2, -3],
width: mlw0
}
}
}])
.then(function() {
_assert('base (autocolorscale:true by dflt)', {
mlcc: blues,
autocolorscale: true,
autocolorscaleIn: undefined,
colorscale: Colorscale.scales.Blues,< 82DE /td>
colorscaleIn: undefined
});
})
.then(function() {
return _run('set *Greens* colorscale', {'marker.line.colorscale': 'Greens'}, {
mlcc: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('back to autocolorscale:true', {'marker.line.autocolorscale': true}, {
mlcc: blues,
autocolorscale: true,
autocolorscaleIn: true,
colorscale: Colorscale.scales.Blues,
colorscaleIn: 'Greens'
});
})
.then(function() {
return _run('back to autocolorscale:false w/ colorscale set', {'marker.line.autocolorscale': false}, {
mlcc: grns,
autocolorscale: false,
autocolorscaleIn: false,
colorscale: Colorscale.scales.Greens,
colorscaleIn: 'Greens'
});
})
.catch(failTest)
.then(done);
});
});
0