Plotly.js: Cannot read property _subplot of undefined

[acrhg]

I have a dashboard with several tabs and charts/tables. The tab that renders on initial page load has an array of five gauge charts (pie charts cut in half with a hole and a line drawn for an indicator) at the top. It looks like this:

Occasionally, one of the charts will not render, like this:

Here is the error I get in the console:

Original post is here. I know this is the part of dash framework but I think something it has to do with the plotly.js. Any help would be really appreciated. Thanks

[etpinard]

Thanks for posting!

It is indeed an error coming from plotly.js.

The first step in debugging would to convert your example into pure plotly.js. Maybe someone could help us out?

[etpinard]

I wasn't able to replicate the problem when adapting the python code provided in https://community.plot.ly/t/chart-randomly-does-not-render/27978 in JS in a codepen.

Closing due to lack of reproducible example.

[slishak]

I know it doesn't help much, but for the record I have also been experiencing this issue for a while. I've so far also been unable to create a reproducible example, but it appears to be caused by repeatedly redrawing a Plotly graph in Dash. I've usually only see it after working with an app for a while and redrawing a plot 20-30 times with different data and layouts, eventually it will throw this error and stop updating until the page is refreshed. Anecdotally it seems to happen most often when I change the layout (e.g. number of subplots). I think it's related to Dash re-using some of the resources from the existing canvas when drawing an updated figure?

[alexcjohnson]

reported again https://community.plot.ly/t/dash-app-with-js-clientside-callback-sometimes-crashes/29599

[etpinard]

Ok - reopening.

[etpinard]

What could help us also would be to use an un-minified version of plotly.js. I'm not sure if there's an easy way to do so from dash though.

[etpinard]

Ok I'm able to reproduce the Cannot read _subplot of undefined bug using:

    fit('should not attempt to rehover over exiting subplots', function(done) {
        var data = [
            {y: [1], hoverinfo: 'y'},
            {y: [2], hoverinfo: 'y', xaxis: 'x2', yaxis: 'y2'}
        ];

        var data2 = [
            {y: [1], hoverinfo: 'y'}
        ];

        var layout = {
            xaxis: {domain: [0, 0.5]},
            xaxis2: {anchor: 'y2', domain: [0.5, 1]},
            yaxis2: {anchor: 'x2'},
            width: 400,
            height: 200,
            margin: {l: 0, t: 0, r: 0, b: 0},
            showlegend: false
        };

        var gd = createGraphDiv();

        Plotly.react(gd, data, layout)
        .then(function() {
            assertLabelsCorrect([300, 100], [303, 100], '2', 'after 1st draw');
        })
        .then(function() {
            var promise = Plotly.react(gd, data2, layout)
            assertLabelsCorrect([300, 100], [303, 100], '2', 'before 2nd react() resolves');
            return promise;
        })
        .catch(failTest)
        .then(done);
    });

That is, by hovering over a subplot that's in the process of getting removed.

We'll release a patch fixing this problem in next week's v1.50.1. I'm not sure if that will fix every Cannot read _subplot of undefined issue, but it should be a step in the right direction.

[renaudl]

Anther reproduction here:
https://github.com/plotly/dash-core-components/issues/672