Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Plotly#redraw (1.20.4.min.js) appears to not clean up properly
See original GitHub issueI have the following, simple code (also see attached zip for standalone:
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>plot.redraw multiple axes</title>
<script src="plotly-1.20.4.min.js"></script>
</head>
<body>
<div id="myDiv1"></div>
<div id="myDiv2"></div>
<script>
var trace1 = {
x: [1, 2, 3],
y: [40, 50, 60],
name: "yaxis data",
type: "scatter"
};
var trace2 = {
x: [2, 3, 4],
y: [4, 5, 6],
name: "yaxis2 data",
yaxis: "y2",
type: "scatter"
};
var layout1 = {
title: "Remove yaxis, use redraw()",
yaxis: {title: "yaxis title"},
yaxis2: {
title: "yaxis2 title",
titlefont: {color: "rgb(148, 103, 189)"},
tickfont: {color: "rgb(148, 103, 189)"},
overlaying: "y",
side: "right"
}
};
var data = [trace1, trace2];
Plotly.newPlot("myDiv1", data, layout1);
Plotly.newPlot("myDiv2", data, layout1);
setTimeout(function() {
delete layout1.yaxis2;
delete trace2.yaxis;
var plot = document.querySelector("#myDiv1");
// plot.layout = layout1;
// redraw appears to not clean out the old data
Plotly.redraw("myDiv1");
var layout2 = {
title: "Using Plotly#newPlot seems to work",
yaxis: {title: "yaxis title"}
};
// this works as expected
Plotly.newPlot("myDiv2", data, layout2);
}, 2*1000);
</script>
</body>
</html>
What I get is the following:
As you can see, the upper plot is being updated with Plotly#redraw while the lower plot is updated using Plotly#newPlot.
I would expect those two invocations to produce the same result. However, in the one using Plotly#redraw, it appears as thought the previous 2nd y-axis and the associated trace is not cleaned up properly. You can also see that when the mouse is hovered over the trace, the ‘old’ trace is not (correctly so) taken into account, i.e. no hover-text appears over the ‘old’ trace.
I have verified this behaviour on a Mac OS 10.10.5 and the following browsers:
- Chromium, Version 55.0.2876.0 (64-bit)
- Chrome, Version 54.0.2840.98 (64-bit)
- Safari, Version 9.1.2 (10601.7.7)
- Firefox, Version 50.0.2
Issue Analytics
- State:
- Created 7 years ago
- Comments:12 (9 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
@czellweg
redrawwill soon be deprecated and be replaced by https://github.com/plotly/plotly.js/issues/1850 - so don’t expect this ticket to be resolved anything soon.In the meantime, I suggest rewriting your logic using
Plotly.restyle,Plotly.relayoutorPlotly.update.Yeah, definitely seems like a reasonable workaround. (Also, of course only one of two plots actually needs a clone.) I think there was a bit of discussion related to this, so I’ll check around and get @etpinard’s input before digging further at the moment.