Skip to content
This repository was archived by the owner on Jun 3, 2024. It is now read-only.
This repository was archived by the owner on Jun 3, 2024. It is now read-only.

unmounting/remounting dcc.Graphs > 16 times with WebGL children results in WebGL contexts warning #535

Open
@wbrgss

Description

@wbrgss

Console warning: WARNING: Too many active WebGL contexts. Oldest context will be lost.

The "oldest" WebGL graph will be un-rendered:

webgl-contexts

Dash app used to demo this bug (same as in #534)
  • Using Chromium Version 73.0.3683.86 (Official Build) Built on Ubuntu , running on Ubuntu 18.04 (64-bit)
  • Using Dash 0.41.0
import dash
import dash_html_components as html
import dash_core_components as dcc

app = dash.Dash(__name__)

app.layout = html.Div(children=[
    html.Div([
        # without the fix in this PR, this graph will disappear after clicking
        # graphs back and forth ~8 times
        dcc.Graph(
            id='example-graph-ex',
            figure={
                'data': [
                    {'x': [1, 2, 3], 'y': [4, 1, 2],
                        'type': 'scattergl', 'name': 'SF'},
                    {'x': [1, 2, 3], 'y': [2, 4, 5],
                     'type': 'scattergl', 'name': u'Montréal'},
                ]
            }
        )
    ]),
    dcc.Tabs(id="tabs", children=[
        dcc.Tab(label='Tab one', children=[
            html.Div([
                dcc.Graph(
                    id='example-graph',
                    figure={
                        'data': [
                            {'x': [1, 2, 3], 'y': [4, 1, 2],
                                'type': 'scattergl', 'name': 'SF'},
                            {'x': [1, 2, 3], 'y': [2, 4, 5],
                             'type': 'scattergl', 'name': u'Montréal'},
                        ]
                    }
                )
            ])
        ]),
        dcc.Tab(label='Tab two', children=[
                dcc.Graph(
                    id='example-graph-1',
                    figure={
                        'data': [
                            {'x': [1, 2, 3], 'y': [1, 4, 1],
                                'type': 'scattergl', 'name': 'SF'},
                            {'x': [1, 2, 3], 'y': [1, 2, 3],
                             'type': 'scattergl', 'name': u'Montréal'},
                        ]
                    }
                )
        ]),
        dcc.Tab(label='Tab three', children=[
                dcc.Graph(
                    id='example-graph-2',
                    figure={
                        'data': [
                            {'x': [1, 2, 3], 'y': [2, 4, 3],
                                'type': 'scattergl', 'name': 'SF'},
                            {'x': [1, 2, 3], 'y': [5, 4, 3],
                             'type': 'scattergl', 'name': u'Montréal'},
                        ]
                    }
                )
        ]),
    ])
])


if __name__ == '__main__':
    app.run_server(debug=True)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions