[BUG] extending a trace in callback using extendData property doesn't work for a figure with multi-level axis

[dmitrii-erkin]

Hello, plotly community,
I'm seeking your help in resolving a trace extension issue for a multi-level axis figure.

Describe your context
Please provide us your environment, so we can easily reproduce the issue.

• replace the result of pip list | grep dash below

dash                              2.14.1
dash-bootstrap-components         1.5.0
dash-core-components              2.0.0
dash-extendable-graph             1.3.0
dash-html-components              2.0.0
dash-table                        5.0.0
dash-treeview-antd                0.0.1

• if frontend related, tell us your Browser, Version and OS

  • OS: Windows 10
  • Browser: Microsoft Edge

Describe the bug

Extending a trace in callback using extendData property doesn't work for a figure with multi-level axis

import dash
from dash.dependencies import Input, Output, State
import dash_html_components as html
import dash_core_components as dcc
import random

app = dash.Dash(__name__)


app.layout = html.Div([
    html.Div([
        dcc.Graph(
            id='graph-extendable',
            figure=dict(
                data=[{'x': [0, 1, 2, 3, 4],
                       'y': [[0,0,0,0], [0,0,0,0]],
                       'mode':'lines+markers'
                       }],
            )
        ),
    ]),
    dcc.Interval(
        id='interval-graph-update',
        interval=1000,
        n_intervals=0),
])


@app.callback(Output('graph-extendable', 'extendData'),
              [Input('interval-graph-update', 'n_intervals')],
              [State('graph-extendable', 'figure')])
def update_extend_traces_traceselect(n_intervals, existing):
    print("")
    print(existing['data'][0])
    x_new = existing['data'][0]['x'][-1] + 1
    d = dict(x=[[x_new]], y=[[[0],[0]]])
    print(d)
    return d, [0]




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

produces the following sequence of the trace data updates:

`{'x': [0, 1, 2, 3, 4], 'y': [[0, 0, 0, 0], [0, 0, 0, 0]], 'mode': 'lines+markers'}
{'x': [[5]], 'y': [[[0], [0]]]}

{'x': [0, 1, 2, 3, 4, 5], 'y': [[0, 0, 0, 0], [0, 0, 0, 0], [0], [0]], 'mode': 'lines+markers'}
{'x': [[6]], 'y': [[[0], [0]]]}

{'x': [0, 1, 2, 3, 4, 5, 6], 'y': [[0, 0, 0, 0], [0, 0, 0, 0], [0], [0], [0], [0]], 'mode': 'lines+markers'}
{'x': [[7]], 'y': [[[0], [0]]]}

{'x': [0, 1, 2, 3, 4, 5, 6, 7], 'y': [[0, 0, 0, 0], [0, 0, 0, 0], [0], [0], [0], [0], [0], [0]], 'mode': 'lines+markers'}
{'x': [[8]], 'y': [[[0], [0]]]}`

Expected behavior

it's expected that both existing levels of y axis are extended 'y': [[0, 0, 0, 0, 0], [0, 0, 0, 0, 0]]

instead of adding new levels 'y': [[0, 0, 0, 0], [0, 0, 0, 0], [0], [0]]

[Coding-with-Adam]

@dmitrii-erkin
Can you please check if you are able to achieve the graph data extension by using Partial Property Updates (extend example)?