Slider stops moving after being "used" 1-3 times

đź“Š Plotly Python
1

Hi guys,

Could you please help me solve an issue with a slider? It updates the data, and the buttons work OK, BUT after being moved “manually” 1-3 times, as well as after pushing the Stop button, it stops moving and changing the currentvalue when the Play button is ON (but keeps updating the data, and keeps working OK when being moved with a mouse).

Strange thing is, the problem occures with a Bar chart, while in a Scattermapbox an identical code works properly.

Here’s the code (with random data):

UPD The real problem is with using patterns to color the bars. Without patterns, the problem is solved by setting both buttons’ “Redraw” settings to “False.” However, bars with patterns make a complete mess out of the animation. I’ve updated the code to show it.

a = ['A', 'B', 'C']
b = np.arange(2010, 2021)
c = 0

df = pd.melt(pd.DataFrame(data=c, index=b, columns=a).reset_index().rename(
    columns = {'index':'year'}), id_vars = 'year', var_name = 'category').drop('value', axis=1)
df['x1'] = pd.Series(np.random.randint(50, 150, size=33))
df['x2'] = pd.Series(np.random.randint(10, 40, size=33))
df['y1'] = pd.Series(np.random.randint(70, 170, size=33))
df['y2'] = pd.Series(np.random.randint(30, 60, size=33))
df = df.set_index('year')

index_list = df.index.unique().tolist()

n_frames = len(index_list)

# Data

fig = go.Figure(
    go.Bar(x = df.loc[2015]['x1'],
           y = df.loc[2015]['category'],
           width = 0.4,
           name = 'x1',
           orientation='h',
           marker_color='red',
           marker_line_color='darkred',
           marker_pattern_shape = '\\',
           marker_line_width=1.3,
           opacity = 1, offset = -0.05))

fig.add_bar(x = df.loc[2015]['x2'],
            y = df.loc[2015]['category'],
            base = df.loc[2015]['x1'],
            width = 0.4,
            name = 'x2',
            orientation='h',
            marker_color='darkred',
            marker_line_color='darkred',
            marker_line_width=1.3,
            opacity = 1, offset = -0.05)

fig.add_bar(x = df.loc[2015]['y1'],
            y = df.loc[2015]['category'],
            width = 0.4,
            name = 'y1',
            orientation='h',
            marker_color='#333333',
            marker_line_color='black',
            marker_pattern_shape = '\\',
            marker_line_width=1.3,
            opacity = 1,
            offset = -0.49)

fig.add_bar(x = df.loc[2015]['y2'],
            y = df.loc[2015]['category'],
            base = df.loc[2015]['y1'],
            width = 0.4,
            name = 'y2',
            orientation='h',
            marker_color='black',
            marker_line_color='black',
            marker_line_width=1.3,
            opacity = 1,
            offset = -0.49
           )

# Frames

frames = []

for i in range(n_frames):
    year = index_list[i]
    frames.append(
        go.Frame(data = 
                 [go.Bar(x = df.loc[year]['x1']),
                  go.Bar(x = df.loc[year]['x2'],
                         base = df.loc[year]['x1']),
                  go.Bar(x = df.loc[year]['y1']),
                  go.Bar(x = df.loc[year]['y2'],
                         base = df.loc[year]['y1'])],
                 traces = [0,1,2,3],
                 name = f"fr{i}"
                )
    )
    
fig.update(frames=frames)

# Sliders

steps = []
for i in range(n_frames):
    year = index_list[i]
    step = dict(label = year,
                method = 'animate',
                args = [
                    [f"fr{i}"],
                    dict(mode = 'immediate',
                         frame = dict(duration = 1000,
                                      redraw = True),
                         transition = dict(duration = 500)
                        )
                ]
               )
    steps.append(step)
    
sliders = [
    dict(
        transition = dict(duration = 0),
        x = 0.16,
        y = 0.03,
        lenmode = 'pixels',
        len = 600,
        currentvalue = dict(visible = True,
                            xanchor = 'center'),
        steps = steps,
        active = 5    
        )
]

# Buttons 

updatemenus = [{
    'type': 'buttons',
    'showactive': False,
    "direction": "left",
    "pad": {"r": 10, "t": 87},
    'x': 0.15,
    'y': 0.1,
    'buttons': 
    [
        {
            'label': 'Play',
            'method': 'animate',
            'args':
            [
                None,
                {
                    'frame': {'duration': 1000, 'redraw': False},
                    'transition': {'duration': 500},
                    'fromcurrent': True,
                    'mode': 'immediate',
                }
            ]
        },
        {
            'label': 'Stop',
            'method': 'animate',
            'args':
            [
                [None],
                {
                    'frame': {'duration': 0, 'redraw': False},
                    'transition': {'duration': 0},
                    'mode':'immediate',
                }
            ]
        }
    ]
}]

# Layout

fig.update_layout(title = 'Title',
                  sliders=sliders,
                  updatemenus=updatemenus
                 )

# Display the figure
fig.show()