Graph relayoutData callback returns different values when slider is present

Dash Python
1

I am using the event ‘relayoutData’ form the dcc.Graph control.
The graph is showing two subplots and a rangeslider for the x axis.
When displayed, the user can select ranges either by changing the slider handles or by directly clicking into the subplots. Both changes have the same effect: the x axis of the subplots is changed to the new slider values.
This triggers the relayoutData event which can be handled by a callback (what is what I’d like to do).

Unfortunately, the relayoutData values passed to the callback differ between the two modes of user interaction.

If the user selects a range by using the rangeslider, the dictionary passed to the callback looks like this:

{'xaxis.range': ['2021-02-03 22:17:06.3677', '2021-09-20 16:05:39.214']}

But when the same is done by clicking and dragging inside one of the subplots, , the dictionary passed to the callback looks like this:

{'xaxis.range[0]': '2021-04-13 18:38:43.4908', 'xaxis.range[1]': '2021-06-29 12:37:15.038'}

This is quite annoying when trying to parse the input. Is this just a typo or intended behavior?

2

Hi @geepy,

I also think the way the relayoutData values are changed when interacting with a dcc.Graph might make it difficult to use in callbacks and posted a somewhat similar question. In that case, a promising answer by @worker1 was to use State(‘graph-figure’, ‘figure’) instead. In the resulting dict, the range values of the figure are also found (e.g. figure[‘layout’][‘xaxis’][‘range’] for the x range), and, as far as I know, the structure of the returned dict is independent of the user interaction method. Does this approach work for you?