Skip to content

Clean up removed axes and axis lines #2416

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.

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 2 commits into from
Feb 28, 2018
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
20 changes: 17 additions & 3 deletions src/plots/cartesian/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -306,6 +306,17 @@ exports.clean = function(newFullData, newFullLayout, oldFullData, oldFullLayout)
purgeSubplotLayers(oldFullLayout._cartesianlayer.selectAll('.subplot'), oldFullLayout);
oldFullLayout._defs.selectAll('.axesclip').remove();
}
// otherwise look for subplots we need to remove
else if(oldSubplotList.cartesian) {
for(i = 0; i < oldSubplotList.cartesian.length; i++) {
var oldSubplotId = oldSubplotList.cartesian[i];
if(newSubplotList.cartesian.indexOf(oldSubplotId) === -1) {
var selector = '.' + oldSubplotId + ',.' + oldSubplotId + '-x,.' + oldSubplotId + '-y';
oldFullLayout._cartesianlayer.selectAll(selector).remove();
removeSubplotExtras(oldSubplotId, oldFullLayout);
}
}
}
};

exports.drawFramework = function(gd) {
Expand Down Expand Up @@ -484,11 +495,9 @@ function purgeSubplotLayers(layers, fullLayout) {

layers.each(function(subplotId) {
var plotgroup = d3.select(this);
var clipId = 'clip' + fullLayout._uid + subplotId + 'plot';

plotgroup.remove();
fullLayout._draggers.selectAll('g.' + subplotId).remove();
fullLayout._defs.select('#' + clipId).remove();
removeSubplotExtras(subplotId, fullLayout);

overlayIdsToRemove[subplotId] = true;

Expand All @@ -515,6 +524,11 @@ function purgeSubplotLayers(layers, fullLayout) {
}
}

function removeSubplotExtras(subplotId, fullLayout) {
fullLayout._draggers.selectAll('g.' + subplotId).remove();
fullLayout._defs.select('#clip' + fullLayout._uid + subplotId + 'plot').remove();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about axis titles? They are removed above in an old vs new axis loop, could we combine that in removeSubplotExtras?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Titles are per axis, because there's only ever one copy per axis, so they're inserted with no reference to the subplot and it would be incorrect to tie their removal to the disappearance of any given subplot.

}

function joinLayer(parent, nodeType, className, dataVal) {
var layer = parent.selectAll('.' + className)
.data([dataVal || 0]);
Expand Down
23 changes: 23 additions & 0 deletions test/jasmine/tests/cartesian_test.js
Original file line number Diff line number Diff line change
Expand Up @@ -345,6 +345,29 @@ describe('subplot creation / deletion:', function() {
.then(done);
});

it('should remove unused axes when deleting traces', function(done) {
Plotly.newPlot(gd,
[{y: [1, 2, 3]}, {y: [10, 30, 20], yaxis: 'y2'}],
{yaxis2: {side: 'right', overlaying: 'y', title: 'Hi!'}}
)
.then(function() {
expect(gd.querySelectorAll('.xy2,.xy2-x,.xy2-y').length).not.toBe(0);
expect(gd.querySelectorAll('.y2title').length).toBe(1);
expect(gd._fullLayout._subplots.cartesian).toEqual(['xy', 'xy2']);
expect(gd._fullLayout._subplots.yaxis).toEqual(['y', 'y2']);

return Plotly.deleteTraces(gd, [1]);
})
.then(function() {
expect(gd.querySelectorAll('.xy2,.xy2-x,.xy2-y').length).toBe(0);
expect(gd.querySelectorAll('.y2title').length).toBe(0);
expect(gd._fullLayout._subplots.cartesian).toEqual(['xy']);
expect(gd._fullLayout._subplots.yaxis).toEqual(['y']);
})
.catch(failTest)
.then(done);
});

it('puts plot backgrounds behind everything except if they overlap', function(done) {
function checkBGLayers(behindCount, x2y2Count) {
expect(gd.querySelectorAll('.bglayer rect.bg').length).toBe(behindCount);
Expand Down